Blogumulus / Blogmulus
Update:
Due to technical issues, Blogmulus was DOA for few months. It is now fixed :- )
Blogmulus Not Working: Just apply the following corrections:
In the HTML code of the template, just replace the lines
http://halotemplates.s3.amazonaws.com/wp-cumulus-example/tagcloud.swf
by the line http://sites.google.com/site/bloggerustemplatus/code/tagcloud.swf
and the line
http://halotemplates.s3.amazonaws.com/wp-cumulus-example/swfobject.js
by the line
http://sites.google.com/site/bloggerustemplatus/code/swfobject.js
Don't forget to check the box "Expand Widget Templates" and also, as always, save your template before any modification.
An Other REALLY cool thing for Blogger is here ... it's Cu3er
Q from Justin:
Hi, Can you please tell me how you do the Cloud tags on the right?, it’s really cool and I love it!
Thanks! Justin
Here it is:
As you can see in the sidebar, it’s a navigation menu through the articles tag.
It makes them look like in a rotating cloud, and I find it very cool.
It needs sometimes a little “refresh” but other than that, it works very well under blogger and WP.
Blogmulus / Blogumus AKA label cloud or Tag cloud is the work of Amanda Fazini & Roy Tank, all credits belongs to them. You’ll find links at the end of this post.
I wish I was that good, but I am not…
How to create a tag cloud for your blog:
SAVE your actual template. If you encounter any issue, you’ll have a backup.
Login into the Blogger dashboard,
Go to “Layout”
Select “Edit HTML”
Select “Before editing….. save a copy of it. Download Full Template”
And SAVE!!!
Once Saved, Re-Save again. –just in case…
Check the Box “Expand Widget Templates”
Using the CTRL-F of your browser, locate the following code: <b:section class='sidebar' id='sidebar' preferred='yes'>
If you can not find the exact code, look for: <b:section class='sidebar'
After this line paste the 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", "0×333333");
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>
Click the preview button and check your blog. If you have an error, double check that you have all the lines correctly pasted.
If you see a widget but the cloud is “empty”, check if you have labels on your post.
Editing size, color & font:
Default values are: *Width is set to 240px
* Height is set to 300px
* Background color is white
* Text color is grey
* Font size is 12
If you like it better wider, shorter, or want to change the color scheme, etc, you will need to do edit various parts of the code. Don’t worry, it’s easy!
Just remember to check the box “expand widgets” or the code may not appear.
Also, if you are using Blogspot editor, you may notice a small change in the code if you save your template. Don’t panic, it’s minimal: You’ll notice some added “"” compared to the original.
Original:
var so = new SWFObject(”http://sites.google.com/site/bloggerustemplatus/code/tagcloud.swf”, “tagcloud”, “240", “300", “7", “#ffffff”);
Blogspot editor:
var so = new SWFObject(http://sites.google.com/site/bloggerustemplatus/code/tagcloud.swf", "tagcloud", "255", "290",
Editing width and height:
Width and height are in this line:
var so = new SWFObject(”http://sites.google.com/site/bloggerustemplatus/code/tagcloud.swf”, “tagcloud”, “240", “300", “7", “#ffffff”);
The value for width is 240 (in Red)
The value for height is 300 (in Blue)
Change the value to the desired size, don’t go too far as you blog settings may not accept a ten fold increase…
Change the values, but keep the quotes.
Example:
var so = new SWFObject(http://sites.google.com/site/bloggerustemplatus/code/tagcloud.swf", "tagcloud", "255", "290",
Editing background & font color:
You can change the background color to any other color by altering the hexadecimal value in the same line: var so = ne….………..“tagcloud”, “240", “300", “7", “#ffffff”);#fffffff is the color white.
If you do not know what color to use, you can check hexadecimal colors in BlogSpot under “Font and Colors” and play around. Don’t forget to “Clear Edit” or you’ll change the color of you entire blog.
Editing Font size and Font Color
Font Color
Find the line: so.addVariable("tcolor", "0×333333");And change the value 0×333333
This time, do not add the hash tag # but keep the 0x
Example: You want Vermilion Red , the hex color is #cc0000
Just copy the cc0000 and add 0x before 0xcc0000 will make your text Red.
Font size:
Locate the line: var='label'><a expr:href='data:label.url' style='12'><data:label.name/></a></b:loop></tags>");The value ‘12’ is your font size.
As you will, with time, add more labels, keep it not too big. A size 18 or 24 will cram everything.
Last but not least, you may have to hit the refresh button if nothing appears at the first view.
As a repeat, Blogmulus / Blogumus AKA label cloud or Tag cloud is the work of Amanda Fazini & Roy Tank. Hail to them: Amanda Fazini: www.bloggerbuster.com Roy Tank: www.roytanck.com
