コメント欄のデザインを変更する

画像を用いた記事のデザインで記事コンテンツのデザインを変更しました。これに合わせてコメント欄のデザインを記事コンテンツに統一しました。

コメント欄

このカスタマイズは記事コンテンツの編集です。マイブログメニューの[デザイン]⇒[コンテンツ]の[記事]から編集を行います。ソース下段あたりに次の記述があります。

<% if:page_name eq 'article' -%>
<% if:individual_article.accept_comment -%>
<div id="comments">
<a name="comment"></a>
<div class="comments-head">この記事へのコメント</div>
<% loop:list_individual_article_children -%>
<div class="comments-body">
<div class="text"><% comment.body | tag_strip | nl2br | clickable('target="_blank" rel="nofollow"') %></div>
<div class="comments-post">Posted by <% if:comment.homepage %><a href="<% comment.homepage | tag_strip %>" target="_blank" rel="nofollow"><% comment.writer | tag_strip %></a><% else %><% comment.writer | tag_strip %><% /if %> at <% comment.createstamp | date_format('%Y年%m月%d日 %H:%M') %><br /></div>
</div>
<% /loop -%>
<div class="comments-head">コメントを書く</div>
<form action="/pages/user/comments2/regist/input" method="post">
<div class="comments-body">
お名前: <br />
<input type="text" name="article_child__writer" size="50" value="" /><br />
メールアドレス: <br />
<input type="text" name="article_child__email" size="50" value="" /><br />
ホームページアドレス: <br />
<input type="text" name="article_child__homepage" size="50" value="" /><br />
コメント: <br />
<textarea name="article_child__body" rows="10" cols="45"></textarea><br />
<input type="hidden" name="article_child__article_id" value="<% individual_article.id %>" />
<input type="hidden" name="article_id" value="<% individual_article.id %>" />
<input name="need_confirm" type="submit" class="input-submit" value="確認する" /><input name="posted" type="submit" class="input-submit" value="書き込む" />
</div>
</form>
</div>
<% /if -%>

この箇所がコメント欄に関する記述です。

コメント日付にcomments_top.png、コメント本文にcomments_middle.png、posted by欄にcomments_bottom.pngという画像を準備して、これら3つの画像を用いてコメント欄をデザインしました。デザイン方法は画像を用いた記事のデザインをご参照下さい。

関連記事:画像を用いた記事のデザイン
トップページへ戻る

サイトマップ

Seesaaブログのカスタマイズ > コメント、トラックバック > コメント欄のデザイン
スタイルシート カスタマイズ

スタイルシート作成ツール

HTMLカスタマイズ
サイト全体

記事コンテンツ

コメント、トラックバック
新着記事

カテゴリ

最近のコメント、トラックバック

検索ページ

その他