Wednesday, July 21, 2010
DrRaman
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.
Live Demo
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("http://sites.google.com/site/bloggerustemplatus/code/tagcloud.swf", "tagcloud", "240", "300", "7", "#ffffff");
// uncomment next line to enable transparency
//so.addParam("wmode", "transparent");
so.addVariable("tcolor", "0x333333");
so.addVariable("mode", "tags");
so.addVariable("distr", "true");
so.addVariable("tspeed", "100");
so.addVariable("tagcloud", "<tags><b:loop values='data:labels' var='label'><a expr:href='data:label.url' style='12'><data:label.name/></a></b:loop></tags>");
so.addParam("allowScriptAccess", "always");
so.write("flashcontent");
</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.
Also upload following files to your host on Google for free
.
http://sites.google.com/site/bloggerustemplatus/code/tagcloud.swf
and
http://sites.google.com/site/bloggerustemplatus/code/swfobject.js
Limitation: This may or may not work with custom domain.
Credits:
WP Cumulus is created by
Roy Tanck for wordpress and bloggerised by Amanda of Blogger Buster.
