seo How To Add A Tag Cloud Widget (Cloud Labels) To Your Blogger/ Blogspot 2013
on Wednesday, June 26, 2013
|
Seo Master present to you: Now i share a special widget, It shows your labels (Categories) like a Cloud. It is 100% working with any blogger templates. It is very easy to install in your blogger follow our tutorials.
Step 1: Log in your Blogger. Step 2: Go to Layout >Page Elements Step 3: Click “Add a gadgets” option then select “ Labels” Gadget from the given list Make sure that you have the Labels Page Element installed. If you haven't already... Step 4: Save it. Step 5: Now go to Templates>Edit HTML Step 6: Make sure that the "Expand Widgets Template" box is unchecked. Step 7: Find Blow code (Ctrl+F). <b:widget id='Label1' locked='false' title='Tags' type='Label'/> Your code may look a little different. So try to find type='Label'. Step 8: Replacing tat code with below code. Once you've located type='Label', remove the whole line of code that looks just like the code mentioned in step 7. Step 9: Replace above line with below code Copy This Code
/* Distributed by Arun Johnson at entertainer001.blogspot.com */ <b:widget id='Label1' locked='false' title='Tags' type='Label'> <b:includable id='main'> <b:if cond='data:title'> <h2><data:title/></h2> </b:if> <div class='widget-content' style='text-align: justify;'> <script type='text/javascript'> /* Simple Blogger Tag Cloud Widget by Raymond May Jr. http://www.compender.com Released to the Public Domain */
//Settings / Variables var max = 150; //max css size (in percent) var min = 70; //min css size (in percent) var showCount = false; // show counts? true for yes, false for no var minCount = 1; // what is the minimum count for a tag to be shown? 1 for all
//Begin code: var range = max - min;
//Build label Array var labels = new Array(); <b:loop values='data:labels' var='label'> labels.push("<data:label.name/>"); </b:loop>
//URLs var urls = new Array(); <b:loop values='data:labels' var='label'> urls.push("<data:label.url/>"); </b:loop>
//Counts var counts = new Array(); <b:loop values='data:labels' var='label'> counts.push("<data:label.count/>"); </b:loop>
//Number sort funtion (high to low) function sortNumber(a, b) { return b - a; }
//Make an independant copy of counts for sorting var sorted = counts.slice();
//Find the largest tag count var most = sorted.sort(sortNumber)[0];
//Begin HTML output for (x in labels) { if(x != "peek" && x != "forEach" && counts[x] >= minCount) { //Calculate textSize var textSize = min + Math.floor((counts[x]/most) * range); //Show counts? if(showCount) { var count = "(" + counts[x] + ")"; }else{ var count = ""; } //Output document.write("<span style='font-size:" + textSize + "%'><a href='" + urls[x] + "' style='text-decoration:none;'>" + labels[x] + count + "</a></span> " ); } } </script> <br/> <span style="font-size:80%;float:right;">Powered by <a href="http://www.entertainer001.blogspot.com">Entertainment</a></span> </div> </b:includable> </b:widget>
Before saving the template make sure to click preview. The new tag cloud should now be visible. If not, make sure that you've completed all the steps correctly.
............................................End.......................................................
2013, By: Seo Master
|
Labels: Blogs and Websites