てんぽ: FC2ブログで管理人のコメントを区別して表示するカスタマイズ

CSSやHTML、FC2ブログのカスタマイズ、共有テンプレートなど

スポンサーサイト

--年--月--日(--)

上記の広告は1ヶ月以上更新のないブログに表示されています。
新しい記事を書く事で広告が消せます。
#
カテゴリ:スポンサー広告

FC2ブログで管理人のコメントを区別して表示するカスタマイズ

2007年09月17日(月)

FC2ブログのコメント欄で、管理人のコメントを他のコメントと区別して表示するカスタマイズ。 コメントのトリップを表すFC2ブログ独自変数<%comment_trip>をclass属性に用い、 そのclass属性を持つ要素のスタイルをCSSで指定します。

たとえば、あるテンプレートのコメント部分は以下のようになっていますが、class属性の値に<%comment_trip>を追加します。

<!--comment-->
<dl id="comment<%comment_no>" class="comment T-<%comment_trip>">
<dt><strong><%comment_name></strong>:<%comment_title></dt>
<dd>
<p>
<%comment_body>
</p>
<ul class="info">
<li><%comment_year>年<%comment_month>月<%comment_day>日(<%comment_wayoubi>)<%comment_hour>:<%comment_minute>:<%comment_second></li>
<li><%comment_url+str></li>
<li><a href="<%comment_edit_link>" title="コメントの編集">編集</a></li>
</ul>
</dd>
</dl>
<!--/comment-->

<%comment_trip>はコメント投稿時に入力したパスワードに応じて8桁の英数字に変換されます。 この英数字をCSSのクラスセレクタとして利用します。

dl.T-yourTrip {
 background: #ffc; /* トリップがyourTripであるコメントの背景を#ffcにする */
}

なお、トリップの先頭が数字である場合やピリオド(.)が含まれる場合、CSSのセレクタとして直接用いることができません。 自分の使っているトリップの先頭が数字の場合は、class="T-<%comment_trip>"などと適当なアルファベットを追加したり、 ピリオドが含まれる場合はバックスラッシュ(\)でエスケープする必要があります。

と、ここまで書いておいて、このネタはどこかで紹介されていたな、と思って検索してみたら ウェビンブログの洵さんでした。あの頃のように…(raraさん)でも実践されています。

#134
カテゴリ:FC2ブログ
タグ[ CSS HTML カスタマイズ ]

(-0件)

コメントの投稿

トラックバック(-0件)

http://mb.blog7.fc2.com/tb.php/134-3e3afd8d

<<可変幅で両側にドロップシャドウ(div一重で) | 「創聖のアクエリオン」が流行っているらしい>>

Utilities

おすすめ

セオリー・オブ・スタイルシート (Quick Master of Web Technique)
「ボックスと視覚整形モデル」の詳細な解説が圧巻。→関連記事
Web標準の教科書―XHTMLとCSSでつくる“正しい”Webサイト
正しい仕様の解説から実践的なレイアウトテクニックまで網羅。→関連記事
詳解HTML&XHTML&CSS辞典 第3版
信頼できる辞典型解説書の筆頭。

広告

上記広告は1ヶ月以上更新のないブログに表示されています。新しい記事を書くことで広告を消せます。