February 3, 2007

Building Category Cloud for MovableType

Here is a nice trick how to build category cloud for your MovableType blog. No plugins required, just past this snippet into your template.

<div class="side" id="CategoryCloud" style="line-height:1.6em;">
<MTCategories show_empty="0">
<a href="<$MTCategoryArchiveLink$>"
class="<$MTCategoryCount$>"><$MTCategoryLabel$></a>
</MTCategories>
<script type="text/javascript">
e = document.getElementById("CategoryCloud").getElementsByTagName("A");
for(i=0; i < e.length; i++)
{
if(e[i].className != "")
{
t = e[i].className;
if(t > 256) e[i].style.fontSize = "230%";
else if(t > 126) e[i].style.fontSize = "200%";
else if(t > 68) e[i].style.fontSize = "180%";
else if(t > 16) e[i].style.fontSize = "160%";
else if(t > 8) e[i].style.fontSize = "130%";
else if(t >= 2) e[i].style.fontSize = "110%";
else if(t = 1) { e[i].style.fontSize = "100%"; }
}
}

</div>

[Found here]

 The idea is simple - generate list of categories with count of posts embedded into class attribute and then in browser scan categories and set font size according to any kind of cloud algorithm.

February 3, 2007 7:49 PM | #Blogging
Comments
Post a comment




Remember Me?