タイトルの横にカテゴリーのアイコンを出す方法をやってみようかと思いながらずっとやってなかった。以前一瞬だけ実行した事あってんけど、なんかしっくり来なくてやめてたんだよな。でもこのネタは面白いので残しておきます。元ネタのTechknow Weblog さんはもうリンク先がないんで紹介出来ないんだけどログとしては残ってるみたいなので該当エントリのリンクを貼っておきますので参考にしてくださいませ。
1.テンプレートを新規作成する
各カテゴリに割り振られたカテゴリIDに関連付けてアイコンを設定するという方法を使います。なのでまず、新しいインデックス・テンプレートを作成しましょう。作成方法は・・・・・・MT やってる人なら新規作成方法わかるだろうから割愛(おい)。
テンプレートの名前:カテゴリIDリスト
出力ファイル名:cat_id.html
こんな風にそれぞれ入力。
そしてテンプレの中身は下をコピペします。
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=<$MTPublishCharset$>" />
</head>
<body>
<MTCategories>
<$MTCategoryLabel$>[ cat<$MTCategoryID$>.gif ]
</MTCategories>
</body>
</html>
画像をgif 以外で利用したい場合は[ cat<$MTCategoryID$>.gif ] の拡張子を変更すればOK。因みにうちは[ cat<$MTCategoryID$>.png ] にしておりました。完成したらこのテンプレのみ再構築。あ、「インデックス・テンプレートを再構築するときにこのテンプレートを自動的に再構築する」のチェックは必ず外します。
2.アイコンの保存名をゲットする
再構築が終了したら自分のブログURL/cat_id.htmlにアクセス。するとそれぞれのカテゴリに当て嵌められたアイコンの名前が表示されちゃいます。
つぶやき[ cat8.gif ]
インストール[ cat9.gif ]
カスタマイズ[ cat11.gif ]
デザイン[ cat10.gif ]
全般[ cat7.gif ]
こんな感じで。それぞれに値するアイコンをこの表示されてる名前でまずはローカルに保存しておきましょー。
3.画像ファイルをアップする
ローカルに保存したファイルをサーバーにアップします。保存先はブログのフォルダ下位にあるimg フォルダなど都合のいい場所がよろしいかと思われます。うちはこのブログフォルダの下位フォルダに保存しました。
4.表示させるテンプレートのタグを変更する
以上で準備は完了っす。次はいよいよテンプレートにタグを追加しますよ。
追加するタグは次のタグです。
<img alt="<$MTCategoryLabel$>" src="<$MTBlogURL$>images/cat<$MTCategoryID$>.gif" width="15" height="15" align="middle" border="0"/>
このタグはMTCategory やMTSubCategories タグなどの中で使用します。
基本はこの形。メインテンプレートに貼り付ける場合は、
<MTEntryCategories glue=" "><a href="<$MTCategoryArchiveLink$>" title="<$MTCategoryLabel$>"><img alt="<$MTCategoryLabel$>" src="<$MTBlogURL$>img/cat<$MTCategoryID$>.gif" width="75" height="50" align="middle" border="0"/></a></MTEntryCategories>
このタグをエントリータイトルの前か後ろに貼り付けます。因みに<$MTCategoryLabel$> を<$MTCategoryDescription$> に変更するとアイコンをあてた時に概要が表示されるようになります。また、ここで画像ファイルのサイズをきちんと指定しておきましょー。そしてこのままコピペするのなら画像の拡張子を自分が作成した画像の拡張子に変更することを忘れずに。
サイドバーのカテゴリリストにアイコンを表示させる場合は、
<h2>カテゴリ別アーカイブ</h2>
<ul>
<MTSubCategories>
<MTSubCatIsFirst><ul></MTSubCatIsFirst>
<MTIfNonZero tag="MTCategoryCount">
<li><a href="<$MTCategoryArchiveLink$>" title="<$MTCategoryDescription$>"><img alt="<$MTCategoryLabel$>" src="<$MTBlogURL$>images/cat<$MTCategoryID$>.gif" width="15" height="15" align="middle" border="0"/><$MTCategoryLabel$></a>
<MTElse>
<li><img alt="<$MTCategoryLabel$>" src="<$MTBlogURL$>images/cat<$MTCategoryID$>.gif" width="15" height="15" align="middle" border="0"/><$MTCategoryLabel$>
</MTElse>
</MTIfNonZero>
<MTSubCatsRecurse max_depth="3">
</li>
<MTSubCatIsLast></ul></MTSubCatIsLast>
</MTSubCategories>
</ul>
このタグを入れ込みます。適宜自分にあったタグに変更した方がいいとは思います。うちはこれは試してないですが(汗)。そしてそれぞれのタグを入れ込み終わったらテンプレを再構築。これで完成です。見本としてはここの個別エントリに適用させてるんでどんな感じになるかはそちらをご覧下さいませ。(時刻表示をクリックすると個別エントリへ飛びます。)