リストマークをアイコン画像にする 2008.05.18

FC2ブログのテンプレート工房さんの記事を参考に、プラグインのリストマーク（・など）をアイコンにしてみました。少々手直しした箇所もあるのでメモ。

まず、スタイルシートの末尾に次の記述を加えてください。

ul { list-style-image: url(http://〜); }

http://〜はアイコン画像のURLに変えてくださいね。
ここまでは、FC2ブログのテンプレート工房さんで紹介されている方法です。

これでうまく行けばいいのですが、わたしの場合、入れているプラグインの関係でリンク1件1件などにもついてしまい、ちょっとうるさい感じになってしまいました。そこで、アイコンをつけたいところだけにつける方法をお教えします。その場合、さっきの記述は消してくださいね。

1. 「プラグインの設定」で、アイコンをつけたいプラグインの「詳細」画面→【HTMLの編集】と進みます。
2. 表示されたHTMLの中に<div id="〜">という記述があるので、「〜」部分を覚えます。見つけにくいところに紛れ込んでいる場合もあるので、よく探してくださいね。ここでは仮にid1だったとします。
3. 「テンプレートの設定」→スタイルシート編集画面の末尾に

div#id1 ul { list-style-image: url(http://〜);}

を追加します。id1の部分は、さっき覚えた「〜」に変えてください。
あとはそれぞれのプラグインのidを調べて、div#id1,#id2 ul { list-style-image: url(http://〜);}のようにコンマで区切って追加していけば大丈夫です♪