Label cloud or tag cloud in blogger

I think you might have seen tag clouds in blogs running WordPress blogging software. Tag cloud is a pretty cool widget that collects all post tags in a particular blog, and then projects out the most popular ones in between others. In Blogger blogs, we can rename it to label cloud as here we use to label each post.
Label cloud widgets are filled up with your keywords. Since they are displayed in the sidebar the reader might click on a keyword of their choice and get re-directed to corresponding pages. So putting a label cloud would improve your blog traffic. Interested? Here is a simple hack to enable a label cloud of tag cloud in Blogger. To begin with, you will have to add a label widget anywhere into your blogger layout as shown below.

Now click on add page element to add a label.

If you’ve already added a label in required location, then here follows the next step.

Remember to download and backup your Blogger templateĀ  before doing any modification.
Press Ctrl+F, search for term <b:widget and press the arrow key on right until you can see the code line <b:widget id=’Label1′ locked=’false’ title=’Tags’ type=’Label’>.
Also, scroll down and find out </b:widget>. Now delete everything in between including the above lines of code.

Download Blogger label cloud code here, copy and paste it in place of the deleted label widget and save.

If you don’t want to display the no:(count) on the labels, search for the line
var showcount=1; and change the value to “0”
Edit the following sections to increase or decrease maximum and minimum font size from default.
var max = 150;
var min = 50;

 simple label cloud in Blogger

Refresh your home page. Now you would be able to see a simple text based label cloud In your Blogger blog.

Animated Label cloud Widget in Blogger:

animated Blogger label cloud

The previous label cloud was a simple text-based widget. This one uses flash and JavaScript to create an animated label cloud widget. Credits for this Blogger Flash label cloud goes to Amanda (, and we appreciate Roy ( for creating WordPress version of the same. Now to enable this hack on your blogger blog, go open the template layout and select edit HTML. Click on expand widget templates.
Now, search for the following line.

<b:section class='sidebar' id='sidebar' preferred='yes'>

Download the animated label cloud code here and paste the lines just below the above given section, then save the changes.
Inside the code lines, locate the following terms and change them with custom values of your choice.

“tagcloud”, “240“, “300“, “7”, “#ffffff“);

240=width , 30= height and #ffffff( hexa color code for white back ground color)
If you need to find out background color of website or a hexa color code finder, use this tool

Change font size of the label cloud to match with your template.

expr:href='data:label.url' style='12'><></a></b:loop></tags>");

Change the font size from 12 to a suitable value.

Both these label cloud looks professionalĀ  but I would prefer the first one. The reasons are given below

1. SEO friendliness. ( Check Blogger SEO tips here)
2. Simple installation.
3. No Flash player required.
4. Better page load time.

So what about you? Which one is your favorite Blogger label cloud widget among the two? Share your thoughts in the comment section.

This entry was posted in Uncategorized by . Bookmark the permalink.

4 thoughts on “Label cloud or tag cloud in blogger

Leave a Reply

Your email address will not be published. Required fields are marked *