« Not No Renaissance Scholar | Main | Richard Rorty, 4 October 1931 — 8 June 2007 »

Scripting Tag Clouds in MovableType

At the moment, I’m in the middle of proctoring the final examination for my afternoon American Literature survey (1918-present). Teaching a month into what is every other universities’ summer “breaks” (more accurately read “frenzied research period”) is one of the perks of being on the quarter system. Ahem.

Even with such a protracted teaching schedule, I have had time to tidy my data, spruce up my blog, trial new software, and spend time with my girlfriend. I’ve even managed to catch a few zombie flicks and observe that

One logic which pervades the zombie films is that anyone can be transformed into one of the undead. Living humans may have to act decisively and aggressively to protect their own lives, their own interests. Once humans recognize the presence of the “living dead,” an oxymoron at best, they can legitimately, rationally (according to the rules of the narrative and the logic of the diegetic social structure) exterminate every single one of them. The exhilaration, disgust, and terror of identifying the presence of the living dead is the terror and exhilaration of identifying a group of people who must be killed, extirpated, whose very existence is a threat to one’s life. Exterminating them is the only “rational” choice, the only “logical” choice. Recognizing the undead issues a genocidal imperative.

Excepting theories of zombie politics, the most noticeable of my start-of-summer activities for you, my gentle and discriminating readers, is the weighted list of topics in this blog’s sidebar referred to by most as a “tag cloud.”

This blog is powered by MovableType and a Google search revealed two pages I found useful in constituting my own tag cloud. The first page I used is titled “How to Make a Tag Cloud for Movable Type Blogs.” There, Ed Kohler (aka Technology Evangelist) provides instructions on using MovableType tags to output custom class values (for the anchor tags, or links) which correspond to specific CSS formatting. In summary, Kohler’s method sets an anchor tag’s class attribute to “tagX,” where “X” is the number of times the specific tag occurs in the blog. The stylesheet itself specifies a ladder for each class value from “tag0” “tag1” to “tagN” where N is any positive integer.

The problem with Kohler’s method becomes apparent in the case of a tag that has been applied to more than N entries. With Kohler’s method, one would have to have at least N+1 values in the stylesheet (presuming you begin at 0), and you would be required to add values (and adjust the ladder spacing/proportions between “rungs”) each time any tag had been applied N times one would have to have increase the number of specified classes to at least N+1 and adjust the ladder spacing (width of the “rungs”) to keep the structure proportional. Kohler’s method requires vigilance and frequent customization, both of which diminish the joy that comes with automation.

A more joyful solution would use a script-based approach like the approach discussed by the chef at eatdrinksleepmovabletype.com. For his weighted category list, the chef uses PHP to construct a simple ladder that will output the appropriate inline styles directly to the page. The code is not very elegant, but it works, and it gave me the second building block for a more elegant solution.

First, you will need to make sure that your web server properly interprets PHP code that is embedded an HTML file. Those of you running your own Apache webserver need only add the following code to /etc/httpd/httpd.conf and restart Apache. (UPDATE: The code I had initially provided--"AddType application/x-httpd-php .php .html"--breaks HEADER.html and README.html prepending and apppending. The code below preserves that functionality.)

Next, find the place in your MovableType template where you would like to have your tag cloud and insert this code.

The PHP code in the middle sets the link class for tags that have been applied to more than 30 entries to “tag31.” In this example, 31 is the “overflow” number. All other tags are assigned a link class that corresponds to the number of times the tag has been applied. In essence, only the overflow condition needs to be programmed. The MovableType variable tags can handle all the other cases. PHP provides just the right glue for this puzzle.

The final piece to be implemented is the CSS stylesheet code block which, for my purposes and as of this wrtiting, is as follows.

As a final note, you’ll notice that the CSS is customized for a black background. That is, tags which occur more frequently do not only appear larger than less frequently occurring tags, but they also appear brighter, chromatically popping from the black background in shades of dark gray to almost white.

Customize to taste. end of article



now can you run that same lesson again, but for "how to add a calendar with links showing events for each day" and "how to put those events in as links" for wordpress.com

and also please throw in
"how the hell do you resize a picture"
"how do you change the font size."

I do like the tag cloud, but I'm too obsessively orderly to have so many little tags of different sizes. I need my categories very structured... but maybe I should get the cloud to you know, challenge myself.