Tag cloud for Blogger blogs!

Many of our friends had asked for animated label/tag cloud as seen on most of the Wordpress blogs. It is known as WP Cumulus plugin. Now it is also available for blogger blogs.

you can see the live demo on the sidebar

Let's add this to you blog.

1. Sign in to Blogger dashboard and go to Design > Edit HTML. Remember to download full template for backup.

2. Pres CTRL F and look for

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

or similar code.

3. Just after that code paste following code

<b:widget id='Label99' locked='false' title='Labels' type='Label'>
<b:includable id='main'>
<b:if cond='data:title'>
<h2><data:title/></h2>
</b:if>
<div class='widget-content'>
<script src='http://sites.google.com/site/bloggerustemplatus/code/swfobject.js' type='text/javascript'/>
<div id='flashcontent'>Blogumulus by <a href='http://www.roytanck.com/'>Roy Tanck</a> and <a href='http://www.bloggerbuster.com'>Amanda Fazani</a></div>
<script type='text/javascript'>
var so = new SWFObject(&quot;http://sites.google.com/site/bloggerustemplatus/code/tagcloud.swf&quot;, &quot;tagcloud&quot;, &quot;240&quot;, &quot;300&quot;, &quot;7&quot;, &quot;#ffffff&quot;);
// uncomment next line to enable transparency
//so.addParam(&quot;wmode&quot;, &quot;transparent&quot;);
so.addVariable(&quot;tcolor&quot;, &quot;0x333333&quot;);
so.addVariable(&quot;mode&quot;, &quot;tags&quot;);
so.addVariable(&quot;distr&quot;, &quot;true&quot;);
so.addVariable(&quot;tspeed&quot;, &quot;100&quot;);
so.addVariable(&quot;tagcloud&quot;, &quot;<tags><b:loop values='data:labels' var='label'><a expr:href='data:label.url' style='12'><data:label.name/></a></b:loop></tags>&quot;);
so.addParam(&quot;allowScriptAccess&quot;, &quot;always&quot;);
so.write(&quot;flashcontent&quot;);
</script>
<b:include name='quickedit'/>
</div>
</b:includable>
</b:widget>

It's done!
Preview your blog for this new tag cloud. It is available as Labels in your Page Elements section. You can drag and drop to anywhere then.

4. Customization
Look at the code given in step 3
240 and 300 are width and height.
ffffff is the background color.
333333 is the text color.
100 is animation speed.
12 is the text size.