ムーバブルタイプでコメント欄の色を交互に変えるプラグイン

December 12th, 2006

以前から、やりたかったコメント欄の色を交互に変えるプラグインを見つけたので、このブログにも先日導入したので、そのプラグインのご紹介と導入方法をメモ。

具体的にどういったことをしたかったのかといいますと。。。

こんな風に↑しましまにコメント欄の色を変えたかっただけ。。。でございます・・・

コメントの数が増えてくると、結構読みづらかったので、導入してみました。意外と簡単どえす。

1. プラグインをダウンロードする

このプラグインを配布されているnlog(n)さんのサイトからプラグインをダウンロードする。

2. プラグインをアップロードする。
ダウンロードしたファイルを解凍してムーバブルタイプのpluginsディレクトリにアップロードします。
ムーバブルタイプの管理画面のプラグインのところに

こんなん↑出てたらとりあえずインストール完了で。

3. テンプレートにタグを入れる
いろいろ、やり方ありますが、CSSを交互に表示するやり方が一番いい感じかと思われるので、そのやり方を。。テンプレートの<MTComments>から</MTComments>で囲まれてる部分を・・・

<MTComments>
<div class="<$MTStripeCommentColor oddnumcolor="comments_odd"
evennumcolor="comments_even"$<"<
<$MTCommentBody$<
<span class="<$MTStripeCommentColor oddnumcolor="comments-post-1"
evennumcolor="comments-post-2"$<"<
Posted by <$MTCommentAuthorLink spam_protect="1"$<
at <$MTCommentDate$<
</span<
</div<
</MTComments<

こんな風に↑テンプレート書き換えて、CSSに”comments_odd”と”comments_even”を書き加えたらええわけです。

ちなみにこのブログではCSSは

.comments_odd {
margin: 0 0 10px 0;
padding: 10px;
border: 1px solid #F2F2F2;
background: #FFF;
}

.comments_even {
margin: 0 0 10px 0;
padding: 10px;
border: 1px solid #F2F2F2;
background: #F8FFE9;
}

こんな風に↑CSSを付け足してみました。これで、偶数番目のコメントの背景は白。奇数番目のコメントは
薄いグリーンになるわけです。

この記事に関連する記事

この記事のタグ

2 Responses to “ムーバブルタイプでコメント欄の色を交互に変えるプラグイン”

さえら Says:
December 12th, 2006 at 3:27 pm
こんにちは。はじめまして。
トラックバックありがとうございました。
管理人 Says:
December 13th, 2006 at 2:00 pm
さえらさん
わざわざ、コメントいただきまして、ありがとうございます。さえらさんのブログ、非常にかわいらしいブログですねぇ。今後ともよろしくお願いいたします～。

DesignWalker