How To Add Animated Revolving Labels Gadget In Blogger

How to add globe like revolving categories or labels gadget in blogger | 101Helper

Every blog and website have some categories which helps users to find what they are looking for. For example if you are looking for cloths in a website you will definitely click on fashion label, dressing label or on other similar label. Similarly in good blogs every post is categorized to help visitors navigate easily. You might have seen a number of stylish categories such as cloud labels, responsive labels etc but I am sure that you haven't seen such impressive categories before, which are show in above image. And I am sure that after looking at them you are also wanting to add this impressive gadget in your blog.

If yes then just follow below steps are you are done, but let me tell you something first before we start that this gadget can't be add as we add normal widgets because it is a modified gadget. So don't think that its a third party gadget and will affect my blog. Let's begin!

Step 1: Go to blogger dashboard and navigate to template.

Step 2: Click on Edit Html.


how-to-edit-template-in-blogger.png

Step 3: Click anywhere in your template code and search below piece of code:

<b:section-contents id='sidebar-right-1'>

OR

<b:section-contents id='sidebar-right-1'/>


how-to-add-animated-labels-cloud-in-blogger

Step 4: Just below it paste the following code:

 

Step 5: Click on save template and you are done.


how-to-save-template-in-blogger

Customization:

To Change Background Color And width/Height:

SWFObject("https://sites.google.com/site/bloggerustemplatus/code/tagcloud.swf", "tagcloud", "300", "300", "7", "#eeeeee");

The default width and height is 300px, you can change it by changing "300" in above piece of code.

To Change The Text Color:

so.addVariable("tcolor", "0x333333");

To change the text color replace 333333 with desired color code. You can use our color picker to generate code of colors. 

To Change The Speed Of Spin:

so.addVariable("tspeed", "100");

To adjust speed of spin replace 100 with desired speed.

 I hope you like this post and it was helpful to you follow and subscribe for latest news about blogger. Share this article with others and keep visiting 101Helper.