[Update] Add Animated label with Hover Effect In Blogger

Labels is very nice gadget to manage your content in well order manner so visitors can easily access what they are looking for or can find related information.In default template label widget are not install .Our topic is about how to add animated flash label widget .As we know blogger template and widget is very simple and not very stylish. Then you had to add widget manually.
Also see silver label widget for blogger

How to add animated flash label widget

You can see the widget image above it looks like this and move labels like floating,if you move mouse hover there it show change in color effect and looks more prominent, and help to organize posts.
Also see how to add stylish search box in blogger

Step1:login to blogger account.first make sure you had add default label gadget by blogger.

Step2:Now go to template and edit HTML

Step3: Find this piece of code.

id='sidebar

Step4: paste below code after id='sidebar


<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://mx-machine.blogspot.com/2014/09/add-animated-label-in-blogger.html'>blogger label widget/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>

Now save the template and visit your blog.you can see widget has been added to your blog.

Share this post