How to create animated tag cloud Blogger blog

Filled under:

Animated Tag or 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.

How to create animation tag cloud to blogger Danukazone Danuka Ranasinghe Dell inspiron Blogger gadget First go to Design > Backup/restore > download your complete template, so that if any error occurs while installing Tag 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'>
<div class='widget-content'>
<script src='' type='text/javascript'/>
<div id='flashcontent'>Animated tags by <a href=''>get you tag</a> and <a href=' /'>Tags created</a></div>
<script type='text/javascript'>
var so = new SWFObject(&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'><></a></b:loop></tags>&quot;);
so.addParam(&quot;allowScriptAccess&quot;, &quot;always&quot;);
<b:include name='quickedit'/>

  • Customizing Your Tag
  • If you want to change the width or height of your Tag following code:
Change the numbers 240 and 300 according to you.
var so = new SWFObject(&quot;;, &quot;tagcloud&quot;, &quot;240&quot;, &quot;300&quot;
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.


  1. Hi to all, the contents present at this web page are really remarkable for people experience,
    well, keep up the nice work fellows.
    Feel free to visit my site Information on improve posture while Sleeping