--- This is on off-topic post. It is published for the benefits of other Movable Type’s users, the piece of software that powers this blog ---
How to shorten the size of a tag cloud using Movable Type 3.3.
Tag management is the new feature introduced in version 3.3 of Movable Type that I liked most.
However, the built-in automatic Tag Cloud sidebar simply grows too big for my site, because I have been using dozens of different tags to classify entries in my blog.
I found an easy way to limit the number of tags displayed in the standard Tag Cloud sidebar without editing any template at all, just changing a single line in the CSS stylesheet.
I am using the standard Vicksburg II (theme-vicksburg.css) style supplied with MT 3.3, but the same principle can be applied to any style.
Find the module-tagcloud section in the CSS file where style definitions for the Tag Cloud are located.
For the Vicksburg II style they are as follows:
.module-tagcloud .module-list {text-align: center; }
.module-tagcloud .module-list { list-style: none; }
.module-tagcloud .module-list-item { display: inline; }
.module-tagcloud li.taglevel1 { font-size: 19px; }
.module-tagcloud li.taglevel2 { font-size: 17px; }
.module-tagcloud li.taglevel3 { font-size: 15px; }
.module-tagcloud li.taglevel4 { font-size: 13px; }
.module-tagcloud li.taglevel5 { font-size: 11px; }
.module-tagcloud li.taglevel6 { font-size: 9px; }
Now, if you want to shorten your Tag Cloud by not showing the least important tags of your blog, all you have to do is to add the display: none property to the style definition for the least important level.
That is, change it to:
.module-tagcloud .module-list {text-align: center; }
.module-tagcloud .module-list { list-style: none; }
.module-tagcloud .module-list-item { display: inline; }
.module-tagcloud li.taglevel1 { font-size: 19px; }
.module-tagcloud li.taglevel2 { font-size: 17px; }
.module-tagcloud li.taglevel3 { font-size: 15px; }
.module-tagcloud li.taglevel4 { font-size: 13px; }
.module-tagcloud li.taglevel5 { font-size: 11px; }
.module-tagcloud li.taglevel6 { font-size: 9px; display: none; }
That’s all.
Now your Tag Cloud will be much smaller. If you want it smaller still, you could change higher levels of the .module-tagcloud definitions as well.
I hope this is helpful. Others suggestions are welcomed.
Stefano, Milan, Italy

Comments (2)
Brilliant idea, thanks for posting it!
Posted by ewan | September 27, 2006 8:42 AM
Posted on September 27, 2006 08:42
Your entry here got me to notice I didn't have any tag cloud mention in my stylesheet (old template)! I was wondering why I couldn't get it to work! I applied your version and it looks great. Thanks!
Posted by Kai Brinker | November 1, 2006 6:38 PM
Posted on November 1, 2006 18:38