Create Animated Tag Cloud

Faizan Ahmad
By -
Blogumus or Animated Tag Cloud looks very interesting, most of us want to create it. So here I am giving you the steps, how you can create tag cloud. First go to Design>Edit HTML, download your complete template, so that if any error occurs while installing Blogumus you can restore your default template. Now search for the following code:

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

In some templates it may be as:

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

Now, just after the above code paste the code given below:

<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>


Now don't save your template, first preview your blog, if it is working then you can save it after editing the color, width and height.


Customizing Your Blogumus


In this default installation, Blogumus includes the following preset variables:

Width is set to 240px
Height is set to 300px;
Background color is white
Text color is grey
Font size is "12"

So, if you want to change anything in Blogumus like, Width, Height, Background color, Text color, Font size you can change, or if you want it unchanged you can save your template.


If you want to change the width or height of your Blogumus search for the following code:

var so = new SWFObject(&quot;http://sites.google.com/site/bloggerustemplatus/code/tagcloud.swf&quot;, &quot;tagcloud&quot;, &quot;240&quot;, &quot;300&quot;

Change the numbers 240 and 300 according to you.

Now, for text color search the code:

tcolor&quot;, &quot;0x0x333333&quot;)

Now, in place of 333333 you can place your text color.

To change background color find the below code:

&quot;7&quot;, &quot;#ffffff&quot;);

In place of #ffffff change your color.

To change font size find the below code:

var='label'><a expr:href='data:label.url' style='12'>

In place of 12 you can enter your value.

Tags: