<< 月別アーカイブのプルダウン化 | TOP | [DS]DQ5・その1 >>

カテゴリ名を画像表示
カテゴリ名1各記事をぱっと見てカテゴリが分かるようにしたいなぁ。
ってことで、記事の頭部分にカテゴリー名を持ってきましたが、どうも印象薄め。
やっぱカテゴリ別に画像とか差し込みたい…と思って探したらありましたよ!!
さっそく導入です。

ただ、どこで拾ったのか…わかんなくなってしまったポロリ
始めに検索でヒットしたところはリンク切れだったし…。(唯一痕跡が残ってるのがここ)
そんなんで、一回自分トコで設定したものをメモ書きです。
(1)表示したい画像を用意して、任意の場所にアップロードする。
普通にアイコンを作ればOK。
サイズはそんなに大きくない方が美しいですね。高さもそろえた方がきれいです。
UP先は、ブログスペース内でも良いと思いますが、容量がそんなに膨大ってワケでもないので、今回は自分のサーバースペースにUPしました。
(間違っても素材サイトから直リンクしないように…)

(2)表示したい場所にスクリプト挿入。
  (<!-- BEGIN entry -->から<!-- END entry -->の中でしか動きません)
<script language="javascript" type="text/javascript">writeAnchorImage('{category_name}');</script>

(3)の直前にスクリプト挿入
<script language="javascript" type="text/javascript"><!--
function writeAnchorImage( anchor ) {
var aImageInfo = new Array(
// ユーザやカテゴリと画像の関連を以下で定義
Array( 'cid=カテゴリ1のID', '表示したい画像のパス' ) // カテゴリ1
,Array( 'cid=カテゴリ2のID', '表示したい画像のパス' ) // カテゴリ2
);
for ( i in aImageInfo ) {
if ( ( index = anchor.indexOf( aImageInfo[i][0] ) ) != -1 ) {
if ( anchor.charAt( index + aImageInfo[i][0].length ) == '"' ) {
document.write( '<img src="' + aImageInfo[i][1] + '" />' );
return;
}
}
}
}
// -->
</script>
カテゴリのIDは設定後に割り振られるので、記事のURLを見て下さい。
ですので、先に記事を上げておく必要があります。
また、一度カテゴリを削除して、同じ名前のカテゴリを登録したとしても、IDは変わります。

後は、カテゴリの分だけ、
,Array( 'cid=カテゴリのID', '表示したい画像のパス' ) // カテゴリ3
を増やせばOKです。
このとき「Array」の前の「,」に注意。
日本語で「&」みたいな意味なので、一列目の頭には付けません。

あと、同じ画像を複数のカテゴリに割り振る場合…どうするのかが分からなかったので、今のところずらずらーっとカテゴリの数だけ羅列してます。


カテゴリ名2こんな感じで完成。
昔JUGEMでやったときはカテゴリ名を数字にして独自タグ+画像タグで表示させてましたが、今回見つけたのは違うやり方でした。
MTはプラグイン制御だったので、そっちに比べるとカテゴリ増える度に設定しないとならないので、後々が面倒臭い気もしますが、そこまでカテゴリ増えないだろうし、これで十分いけそうです。

カテゴリ名3[追記]
本当は所属カテゴリへのリンクは記事末のコメントとかトラックバックの横に入れて、記事頭にはアイコンだけにしたかったのだけど、アイコンを作るのがめんどくさ…かっので…とりあえず、配布素材から拝借(ココ)しました。
そのうち左な感じに切り替えると思います。
切り替えました。
:: 雑記(カスタマイズ) | comments(0) | trackbacks(0) | posted by 二瀬古 
コメント




※文中にメルアドやURLがあると弾かれます。管理人への連絡は、こちらに記載のメルアド宛にお願いします。
トラックバック URL
http://blog.nisekobox.com/trackback/111