記事投稿者によるコメントのときおよび返信コメントにclass属性

コメンテーターが記事投稿者である場合や記事投稿者が返信コメントしたときならびにゲスト投稿者が返信コメントをしたときclass属性を付与するというのを試してみました

コメントの種類を分ける

Movable Typeのシステムが受けとったコメントの種類を分類してみます。色々なわけ方があるかと思うのですが、ここでは、コメンターが記事作成者なのかそうではないのか、というところに重点を置いて、起こり得る事象で分けてみます。

*記事作成者以外のコメンテーターをここでは便宜上「ゲスト」としておきます

コメントの返信機能を利用していない場合

これに対して、コメントの返信機能を利用した場合、コメントの種類が少し増えて以下のようになります

コメントの返信機能を利用している場合

コメントの種類によってclass属性を与えることを具体的にまとめると以下のようなものです。

クラス名などはこちらで適当につけたものなので適宜かえたらよいかと。

コメントのテンプレートの書き換え

MT4.2のデフォルトテンプレートの例で説明します。コメント返信の機能を利用しているものとして

コメントのテンプレートモジュール(comments.mtml)から以下のようなコードの行を探します。

<div id="comment-<$mt:CommentID$>" class="comment<mt:IfCommentParent> comment-reply</mt:IfCommentParent>">

コメントが記事投稿者である場合は、MTIfCommenterIsEntryAuthorというテンプレートタグを使ってclass属性を付与してみます。

<div id="comment-<$mt:CommentID$>" class="comment<mt:IfCommentParent> comment-reply</mt:IfCommentParent>
<MTIfCommenterIsEntryAuthor> entry-author</MTIfCommenterIsEntryAuthor>">

*横に長くなるため途中改行しています。

あとはスタイルシートでお好みのスタイル指定でカスタマイズすれば、コメントの状態の表現が可能ということになります。

実際におこなってコメント欄にも付与されたクラス名を出力させてみた結果を以下のキャプチャにて示します。

ここでのカスタマイズでは、単にclass属性の属性値を複数与えることでスタイル分けしようとする(#なんちゃってスレッド風みたいな)ものですが、構造的にコメントを階層化したいときはMovableType.jp の以下の記事が参考になります。