エントリーのタイトル前にカテゴリ別画像を表示する

エントリのタイトル前に画像があったら、文章だけのエントリーもけっこうにぎやかな感じになって楽しいものです。

こういうテクニック、どうやって実現するのかと思っていろいろ試行錯誤してみたんですが、なかなかうまくいきません。アイコン表示専用のプラグインを見つけたのですが、設定方法がまずいのかうまく動作しません。
はてどうすればいいものか、と頭をひねっているうちに意外と簡単な方法が見つかりました。最近Movable Typeを始めた方のなかには多分他にもやってみたい方がいるかもしれないと思ったのでご紹介します。

１．まずはウェブログのアーカイブの配下に「icons」フォルダを作ります。その中にカテゴリの数だけ画像を作ります。
画像の名前は登録したカテゴリと同じ名前です。私の場合、カテゴリ名に半角スペースは入れないようにしていますが、カテゴリ名に半角スペースを使っている場合は多分その該当箇所を「_」（アンダーバー）にした方がいいと思います。また、シングル・クォーテーション、ダブル・クォーテーションを使っている場合は削除します。大文字、小文字の表記はそのままにします（一部大文字、小文字を厳密に認識するブラウザがあるため）。
※日本語カテゴリ名の場合はやってみたことないのでよくわかりません。

２．「テンプレートの編集」でMain Indexの<h3>部分を以下のように書き換えます。

（初期）
<h3 class="title"><$MTEntryTitle$></h3>

（改造後）
<h3 class="title">
<img src="<$MTBlogURL$>archives/icons/<$MTEntryCategory$>.gif" alt="<$MTEntryCategory$>" width="32" height="32" border="0" />
<$MTEntryTitle$>
</h3>

３．必要に応じてIndivisualテンプレートも同様に書き換えます。

４．再構築（Rebuild）してフィニッシュ。

以上です。興味のある方はトライしてみてください。

※<$MTBlogURL$>の後に続けるarchives/iconsというパスはそれぞれ個人の設定の仕方によって異なりますので注意してください。
私の場合は http://www.2-1b.com/archives/icons/（カテゴリ名）.gif に辿り着くように指定しています。
※画像サイズのwidth、height属性の数値はサンプルです。作りたい画像のサイズに合わせて変更してください。属性設定は省いても大丈夫ですが、画面のレンダリングスピードに若干影響するのでサイズは指定したほうがいいと思います。alt属性もなくても動きはしますが、アクセシビリティのことを考えるならちゃんと指定するべきですね。

P.S.
たぶんカテゴリの概要（Description）にimgタグを埋め込んで、それを表示しちゃえばもっと簡単だったと思うのですが、イレギュラーな使い方をしたくなかったので、ちょっと回り道してしまいました。