コメント欄

全体構造

<div class="comment">
	～コメント欄ヘッダ～
	～コメント表示欄～
	～コメントフォーム～
</div>

div.comment はコメントがあるか、コメントフォームが存在するとき出力されます。
div.comment には id が出力されていますが、これはJavaScriptのためのものです。可変しますので、使用しないでください。

コメント欄ヘッダ

コメントがあれば表示されます。

<div class="caption">
	<a class="switch" href="～"><span class="open">▼</span></a>
	<a href="～"><span class="caption-title">コメント</span>
	<span class="num">（4件）</span></a>
</div>

最初のスイッチは記事の閉じるスイッチと同じです。次いで、コメント欄自身へのリンク、コメント数となっています。

コメント表示欄

コメント表示欄はコメントかあるときにのみ出力されます。コメントの表示は、複数記事表示のときは本文を省略形表示します。単一記事表示のときはコメント全文を表示します。これにより若干、クラス構造が違います。

コメント表示形式（単一表示）

<div class="commentshort"><div class="commentbody">
	～１つ目のコメント～
	～２つ目のコメント～
</div></div>

１つのコメントの構成。

<div class="comment-one">
<div class="commentator"><p>
	<span class="canchor"><a name="～" href="～この場所へ～">#</a></span>
	<span class="commentator author">なまえ</span>
	<span class="comment-date">2006年08月06日(日) 午後6時19分</span>
	<span class="system-msg"></span>
</p></div>
<div class="comment-text"><p class="ni">１行目<br>２行目<br>最後の行</p></div>
</div>	<!-- end of comment-one -->

div.comment-one が１つのコメントの区切りです。これらクラスのうち span.author はコメント欄以外でも使用されるクラスです。

span.system-msg にはログイン時に「非公開」*1または「非表示」*2の文字が入ることがあります。出力形式は以下のとおりです。

<strong class="hidden-com">（非公開コメント）</strong>
<strong class="void">（非表示）</strong>

コメント表示形式（複数表示）

<div class="commentshort"><div class="commentshortbody">
	～１つ目のコメント～
	～２つ目のコメント～
</div></div>

※Ver1.43以前は div.commentshortbody は出力されません。ご注意ください。

１つのコメントの構成。

<p><span class="canchor"><a name="～" href="～この場所へ～">#</a></span>
	<span class="commentator">なまえ</span>
	『１行目２行目最後の行』
　<span class="comment-date">(2006/08/06 18:19)</span></p>

コメント本文はある文字数以上*3になると省略して表示され、また文中の改行はすべて無視されます。

単一記事表示のときにあった「非公開」または「非表示」は「なまえ」の手前 span.commentator 中に出力されます。

コメントフォーム

コメントを書き込むためのフォームです。単一記事表示のときのみ出力されます。

<form method="post" action="～" class="comment">
<br><p><span class="canchor">#</span>
  <input name="name" size="15" value="" type="text"> 
  <input name="post" id="post_comment" value="投稿" type="submit">
</p>
<textarea name="comment_txt" cols="60" rows="3"></textarea>
</form> <!-- end of comment form -->

表示に関連する要素のみ書いてあります。

関連記事