Tag Cloud, Labels, Category widget or whatever you call it. This widget is very important in your blog. This helps the visitors to navigate further your blog easily. The usual widget shows the list of the labels you have in your posts which is kinda normal to a blog. Some bloggers are experimental in nature and want some new stuff running in their blogs and this widget fit them most.
This widget is a 3D Spherical Animated Tag Cloud Widget known as Blogumus. As the name implies, this is animated so the labels or categories that it shows have a special effect. If a visitor hover his mouse to the widget then the labels will start rotating in a spherical pattern. Just follow the steps below to have it on your blog.
1. Go to your Dashboard >> Design >> Edit HTML.
2. Find the code below (just press Ctrl+F and paste the code on the search bar to find it easily)
if you can't find the code above the finding the code below<b:section class='sidebar' id='sidebar' preferred='yes'>
<b:section-content id='sidebar-right-1'> or <b:section-content id='sidebar-left-1'>
3. Copy the code below and paste it directly after the code in step 2
<b:widget id='Label99' locked='false' title='Tag Cloud' 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</div> <script type='text/javascript'> var so = new SWFObject("http://sites.google.com/site/bloggerustemplatus/code/tagcloud.swf", "tagcloud", "160", "200", "7", "#ffffff"); // uncomment next line to enable transparency //so.addParam("wmode", "transparent"); so.addVariable("tcolor", "0x800060"); 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>
4. Preview your blog. If you see the widget running completely then you can save your template.
IMPORTANT: You can change some of the variables on the code to fit the widget to your theme.
Find the digits below and change it the same as your theme.
Text color: 800060 (purple as default in the code above)
Height: 200 px
Width: 160 px
Font size: 12
Drop your questions on the comment box if you have problem implementing this widget. Good day!
0 comments:
Post a Comment