Many of our friends had asked for animated label/tag cloud as seen on most of the Wordpress blogs. It is known as WP Cumulus plugin. Now it is also available for blogger blogs.
Live Demo
Let's add this to you blog.
1. Sign in to Blogger dashboard and go to Design > Edit HTML. Remember to download full template for backup.
2. Pres CTRL F and look for
or similar code.
3. Just after that code paste following code
It's done!
Preview your blog for this new tag cloud. It is available as Labels in your Page Elements section. You can drag and drop to anywhere then.
4. Customization
Look at the code given in step 3
240 and 300 are width and height.
ffffff is the background color.
333333 is the text color.
100 is animation speed.
12 is the text size.
Also upload following files to your host on Google for free
.
http://sites.google.com/site/bloggerustemplatus/code/tagcloud.swf
and
http://sites.google.com/site/bloggerustemplatus/code/swfobject.js
Limitation: This may or may not work with custom domain.
Credits:
WP Cumulus is created by Roy Tanck for wordpress and bloggerised by Amanda of Blogger Buster.
Live Demo
Let's add this to you blog.
1. Sign in to Blogger dashboard and go to Design > Edit HTML. Remember to download full template for backup.
2. Pres CTRL F and look for
<b:section class='sidebar' id='sidebar' preferred='yes'>
or similar code.
3. Just after that code paste following code
<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("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>
It's done!
Preview your blog for this new tag cloud. It is available as Labels in your Page Elements section. You can drag and drop to anywhere then.
4. Customization
Look at the code given in step 3
240 and 300 are width and height.
ffffff is the background color.
333333 is the text color.
100 is animation speed.
12 is the text size.
Also upload following files to your host on Google for free
.
http://sites.google.com/site/bloggerustemplatus/code/tagcloud.swf
and
http://sites.google.com/site/bloggerustemplatus/code/swfobject.js
Limitation: This may or may not work with custom domain.
Credits:
WP Cumulus is created by Roy Tanck for wordpress and bloggerised by Amanda of Blogger Buster.




41 comments:
@drraman i want to up and down my posts, because when i post new post it comes on the top, i want it to be in the last. is it possible!
@drraman i am not getting it, please have a look on my code
can you find
<b:section class
in your code?
@drraman i got thiskind of thing on my blog ...yes i got it !
please help me out
it should also contain word "sidebar"
@drraman i got this kind of thing section-contents id='sidebar-right-1
please help me out
Copy the code given in step 3 and paste below this code.
First thing is DO NOT SHARE YOUR USERNAME AND PASSWORD WITH ANYONE.
Now I got your problem. You not added labels/tags/categories to your posts. Edit post and add lables first.
@drraman i have applied the labels but its not coming.
see whats is the problem
@drraman, i done with the LABELS, now please tell me how i can change colour of blog title. i want to use 00000, same as in footer, please let me know.
Thanks
Go to Design > Template Editor
Read more
Blogger releases it's official template designer tool
@drraman , still problem with submenu's please do it for me, here is the link of index file.
file:///C:/Users/Harpreet%20Singh/Documents/template/index.html
please help me out in this.
Thanks
Open CSS menu Generator.
Go to step 3
3)Get the files
Click on Template Help Info and also on HTML/css code. Read and study carefully.
@drraman here it is written that used only for 5 submenu with only 1 drop down menu..
also how to attach css file in blog...
please sort it out and use your own code as above you used to design submenus, you can take html coding from here, it would be easier for me..
please i am not getting it...please
Please comment in correct post. This post is not related to Navigation drop down menubar?
@drraman not showing on my blog.
jobsansaar.blogspot.com
please check it out whats the problem
It was working on previous template.
Now you have changed template.
Now add this freshly.
@drraman its coming now, when i added label to fresher then it will not come, when i remove then it come,
What's this ?
You mean to say the Freshers label is not appearing in the label cloud?
@drraman, when i add fresher to the label then the whole label will not apear, whats the problem
You should not add labels to posts like Home, About Us. Because these pages are made once.
I bloody give up! Does NOT work!
Hi Melissa,
Please explain your problem with details.
Help?
My background is black and the letters in the cloud are white. when i move my house over the labels they become black and not visible.
how can i change the color ?
sorry for not posting the link of the blog. here it is - http://mooreeya.blogspot.com
If you read the main article carefully, it is well explained there. Try changing the background color.
it only changes the background, still doesn't change the link hover, i tried changing many things but still couldn't do it.
Your link hover color is grey/black. Change it from edit template.
I dont see such code . .
The one mentioned in step 2 . If i am not having tat how could i form the cloud ??
What should i do ??
Hi Yuvan,
Look for
id='sidebar
i saw your blog and the color of the link hover in the cloud tag is white, i tried to do that too but i could. Do you mind telling me how you managed to change the color ?
Really awesome.
I have installed this widget on my blog.Thanks
i cant find the code...help me please...
Hi Dodee Pranata
Just look for
sidebar' id='sidebar
don't see
error: label99 why ?
@ Ngọn Hải Đăng
explain in details
it's so cool, thanks...
i can't find ....
its not working........
Try new updated code
thanks.you are best.
Post a Comment