Al-Muhajabah's Movable Type Tips

To make it easier to tell what you're looking at, I've done a sort of "color-coding" for each of my categories at Al-Muhajabah's Islamic Blogs. A Quranic Journal has a yellow background, The Clipboard has a blue background, and veiled4allah has a pink background. There are two ways that this could be done. One is to set up a separate stylesheet for each category. I could then hard-code it into the index pages that I've made for each category and then call it on the category archive pages with something like:

<link rel="stylesheet" type="text/css" href="<$MTBlogURL$><$MTArchiveCategory dirify="1"$>.css">

and on the individual entry pages (and also the comments and trackback pop-ups) with something like:

<link rel="stylesheet" type="text/css" href="<$MTBlogURL$><$MTEntryCategory dirify="1"$>.css">

The other method is to define a class for each category in the existing stylesheet and then modify the elements on the page to include the category name in their CSS class. Again, the index pages have the category hard-coded and the archive pages (and comment and trackback pop-ups) have the appropriate category fed in with the MTArchiveCategory and MTEntryCategory tags.

Although the first method is easier, I actually did it according to the second method. Go figure.

This is one of several tricks that you can use to give your pages from different categories a slightly different appearance. The same basic technique of using dirified category names (A Quranic Journal becomes a_quranic_journal, The Clipboard becomes the_clipboard and veiled4allah remains veiled4allah) can also be used to assign different image files for the categories. There's also the TopIcon plugin, which I'm using and will discuss in a later post, inshallah.