Etsy

Saturday, May 27, 2017

How to Add Flash Animated Label Cloud Widget to Blogger

Animated Tag Cloud Widget for Blogger is a great plugin that shows the blog tags alternately. This widget was designed for WordPress but is now available for Blogger.

It is a widget which displays your blog's label in cloud effect that works based on jQuery and Flash. 


View:
Flash Animated Label Cloud Widget to Blogger



Here is the quick way to add this widget to your blog.
I will explain how to use this plugin in Blogger:


Note: Backup your blogger template before moving forward to the next step!



<b:widget id='Label786' 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='//ajax.googleapis.com/ajax/libs/swfobject/2.2/swfobject.js' type='text/javascript'/>
<div id='w2bFlashLabes'>New Flash Labels by <a href='http://www.way2blogging.org'>Way2Blogging</a></div>
<script type='text/javascript'>
var flashvars = {};
flashvars.tcolor = &quot;0x000000&quot;;
flashvars.hicolor = &quot;0x333333&quot;;
flashvars.mode = &quot;tags&quot;;
flashvars.distr = &quot;true&quot;;
flashvars.tspeed = 100;
flashvars.tagcloud = &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;;
var params = {};
params.wmode = &quot;transparent&quot;;
params.bgcolor = &quot;#FFFFFF&quot;;
params.allowscriptaccess = &quot;always&quot;;
var attributes = {};
swfobject.embedSWF(&quot;http://widgets.way2blogging.org/blogger-widgets/way2blogging-tagcloud.swf&quot;, &quot;w2bFlashLabes&quot;, 250, 250, &quot;9.0.0&quot;, &quot;http://swfobject.googlecode.com/svn/trunk/swfobject/expressInstall.swf&quot;, flashvars, params, attributes );
</script>
<b:include name='quickedit'/>
</div>
</b:includable>
</b:widget>




Copy the code and follow the steps below:


1. Go to Design section > Edit HTML

2. Search this code:



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

If you can't find it, try to find this one:


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


3. Add the code above just after it

4. Now save the template and check your blog!

No comments:

Post a Comment

Powered by Blogger.
author
Ралица Василева
Здравей, приятел! Аз съм Рал, графичен дизайнер и дизайнер на бижута. Намери повече за мен тук :)