Movable Type CMSプラットフォーム Movable Type
ドキュメントサイト

Movable Type 4 ManualMovable Type 4 マニュアル

コメントのスレッド表示

最終更新日: 2008.05.29

コメントスレッド機能は、ブログ記事やフォーラムトピックへのコメントがどのようにやりとりされているのかを読者にわかりやすくし、コミュニケーションしているかを解りやすく視覚化します。

一般的に、コメントのスレッドには2種類あります。

時系列に並ぶコメントスレッド

コメントを時系列に並べ、コメントがいづれかのコメントへの返信なら、そのコメントへの返信であることを示すテキストと、リンクを表示します。

階層化するコメントスレッド

投稿したコメントがいづれかのコメントへの返信なら、そのコメントは元のコメントの子となるように入れ子にされます。

コメントスレッド機能を使用する

新たにインストールした Movable Type 4.2 を使用しているなら、デフォルトテンプレートがコメントスレッド機能に対応しているので、特に修正をしなくてかまいません。

しかし、MT4.2 より以前のバージョンからアップグレードした場合は、テンプレートのリフレッシュを行うか、テンプレートにいくつかの変更を加えるだけでコメントのスレッド表示に対応できます。

返信リンクの設置

まずコメント返信のリンクを設置します。設置する場所は投稿されたコメントの中が良いでしょう。MTComments ブロックタグの中に MTCommentReplyLink ファンクションタグを設置します。

<p class="comment-footer">
  Posted by
  <$MTCommentAuthorLink default_name="Anonymous"$> &#60;$MTCommentAuthorIdentity$> |
  <a href="#Comment-<$MTCommentID$>"><$MTCommentDate$>&#60;/a> |
  <$MTCommentReplyLink$>
</p>

MTCommentReplyLink は何も設定しなくても 返信 というテキストでリンクを出力しますが、text モディファイアを使うと、任意の文字で返信リンクを出力できます。

時系列に並ぶコメントスレッドを作成する

Movable Type 4.2 より前のバージョンに同梱されていたデフォルトテンプレートをカスタマイズして対応するには、ブログのテンプレートモジュールにある [コメント詳細] を開きます。そして次の内容を探してください。

<$MTCommentAuthorLink default_name="Anonymous" show_email="0"$>
<MTIfNonEmpty tag="CommentAuthorIdentity"><$MTCommentAuthorIdentity$></MTIfNonEmpty> said:

その部分を次のように書き換えます。

<!-- この部分はコメント投稿者名を表示します。これまでと同じです -->
<$MTCommentAuthorLink default_name="Anonymous" show_email="0"$>
<MTIfNonEmpty tag="CommentAuthorIdentity"><$MTCommentAuthorIdentity$></MTIfNonEmpty>
から
<!-- 投稿されたコメントに親コメントがあるかどうかを確認します。つまり返信かどうかを判断しています。 -->
<MTIfCommentParent>
    <MTCommentParent> <!-- 親コメントのコンテキストを設定 -->
        <a href="#comment-<MTCommentID>"><MTCommentName>のコメント</a> への返信
    </MTCommentParent>
<MTElse> <!-- 返信じゃなかったら MTElse 以下を処理 -->
    のコメント
</MTIfCommentParent>

これで返信コメントの時はfooからbarコメントへの返信と表示し、返信では無いときはfooからのコメントと表示します。

階層化するコメントスレッドを作成する

コメントを時系列に並べるのではなく、階層化表示にすとコメントの返信状況などをよりわかりやすく表示できます。コメントに対する返信は、親コメントよりやや字下げして表示されます。

ブログの [コメント] テンプレートモジュールの中から次の部分を探します。

<$MTInclude module="Comment Detail"$>

その部分を次のように書き換えます。

<MTIfCommentParent><MTElse> <!-- コメントが返信で無いかどうかの確認 -->
   <!-- 返信で無いときはトップレベルに表示 -->
   <$MTInclude module="Comment Detail"$>
   <MTCommentReplies> <!-- コメントの返信の処理のために繰り返し処理 -->
   <!-- もし返信なら左側に20pxのマージンを設定 -->
   <MTCommentsHeader><div style="margin-left: 20px;"></MTCommentsHeader>
   <!-- コメントの詳細を表示 -->
   <MTInclude module="Comment Detail">
   <!-- 返信のために同じ処理を再帰的に繰り返し処理します -->
   <MTCommentRepliesRecurse>
   <!-- 返信のをわかりやすくするためにインデントしていて、ここがその最終なら div 要素を閉じます -->
   <MTCommentsFooter></div></MTCommentsFooter>
   </MTCommentReplies>
</MTIfCommentParent>

字下げするスタイルは、style 属性を使用しなくても class 属性を付与するなどして外部スタイルシートで定義してもかまいません。

この機能について

この機能は Arvind Satyanarayan 氏作成の Simply Threaded プラグインによる貢献の結果です。