10-2 コメントをスレッド形式で表示する

191ページ

「コメント」テンプレートモジュール

<mt:SetVarTemplate name="comment_data">
<div id="comment-<mt:CommentID />" class="comment<mt:ifCommentParent> comment-reply
</mt:ifCommentParent>">
  <div class="inner">
    <div class="comment-header">
      <div class="asset-meta">
        <span class="byline">
  <mt:ifCommentParent>
    <mt:CommentAuthorIdentity /> <span class="vcard author"><mt:CommentAuthorLink /></span>から<a href="<mt:CommentParent>#comment-<mt:CommentID /></mt:CommentParent>"><mt:CommentParent><mt:CommentAuthor /></mt:CommentParent></a>への返信
  <mt:else>
    <mt:CommentAuthorIdentity />
        <span class="vcard author"><mt:CommentAuthorLink /></span>
  </mt:ifCommentParent>
| <a href="#comment-<mt:CommentID />"><abbr class="published" title="<mt:CommentDate format_name="iso8601" />"><mt:CommentDate relative="js" /></abbr></a>
  <mt:ifCommentsAccepted> | <mt:CommentReplyToLink /></mt:ifCommentsAccepted>
        </span>
      </div>
    </div>
    <div class="comment-content">
      <mt:CommentBody />
    </div>
  </div>
</div>
</mt:SetVarTemplate>
<div id="comments" class="comments">
<mt:Comments>
  <mt:CommentsHeader>
  <h2 class="comments-header">コメント(<mt:EntryCommentCount />)</h2>
  <div class="comments-content">
    <ul class="comment-replies">
  </mt:CommentsHeader>
  <mt:ifCommentParent>
  <mt:else>
      <li class="comment-replies-content">
    <mt:GetVar name="comment_data" />
    <mt:CommentReplies>
      <mt:CommentsHeader>
        <ul class="comment-replies">
      </mt:CommentsHeader>
          <li class="comment-replies-content">
      <mt:GetVar name="comment_data" />
      <mt:CommentRepliesRecurse />
          </li>
      <mt:CommentsFooter>
        </ul>
      </mt:CommentsFooter>
    </mt:CommentReplies>
      </li>
  </mt:ifCommentParent>
  <mt:CommentsFooter>
    </ul>
  </div>
  </mt:CommentsFooter>
</mt:Comments>
</div>

193ページ

.comments-content ul.comment-replies {
    list-style: none;
    margin-left: 0;
    padding-left: 0;
}
.comments-content li.comment-replies-content li.comment-replies-content {
    margin-left: 10px;
    padding-left: 10px;
}