小粋空間  -  a cheap joke and a play on words site

FC2ブログテンプレート修正（コメント編集タグの追加等）

現在公開中のFC2ブログ用テンプレートに不具合がありましたので修正しました。テンプレートのエントリーは修正済ですが、部分的に修正される方は下記の内容をご覧ください。

１．コメント編集タグの追加

FC2ブログでは投稿したコメントを、投稿時に設定したパスワードを用いることで該当のコメントを（投稿した人が）ブラウザから編集することが可能です。これまでコメント投稿画面でパスワード入力の設定ができるようにしておりましたが、コメント編集画面へのリンクと編集画面自体がごっそり欠落しておりました。すいません。

これまでのテンプレートに変更を加える場合は、 /comment_area ? trackback_area の間に下記の青色部分を挿入してください。

　　　　　：
<!--/comment_area-->
 
<!-- コメント編集 -->
<!--edit_area-->
 
<div id="comments" class="comments">
 
   <!-- コメント編集 -->
   <form method="post" action="./" name="comment_form">
   <input type="hidden" name="mode" value="edit">
   <input type="hidden" name="mode2" value="edited">
   <input type="hidden" name="edit[rno]" value="<%eno>">
 
   <!-- コメント投稿フォームタイトル -->
   <div class="comments-open" id="comments-open">
      <h2 class="comments-open-header">コメントの編集</h2>
 
      <div class="comments-open-content">
 
         <!-- コメント投稿フォーム開始 -->
         <div id="comments-open-data">
            <dl>
               <dt><label for="comment-author">名前:</label></dt>
               <dd><input id="comment-author" name="edit[name]" tabindex="6" accesskey="n" size="20" value="<%edit_name>" /></dd>
               <dt><label for="comment-title">タイトル:</label></dt>
               <dd><input id="comment-title" name="edit[title]" tabindex="7" accesskey="t" size="30" value="<%edit_title>" /></dd>
               <dt><label for="comment-email">メールアドレス:</label></dt>
               <dd><input id="comment-email" name="edit[mail]" tabindex="8" accesskey="m" size="30" value="<%edit_mail>" /></dd>
               <dt><label for="comment-url">URL:</label></dt>
               <dd><input id="comment-url" name="edit[url]" tabindex="9" accesskey="u" size="30" value="<%edit_url>" /></dd>
               <dt></dt><dd><script type="text/javascript" src="http://blog8.fc2.com/load.js"></script></dd>
               <dt><label for="comment">コメント:</label></dt>
               <dd><textarea id="comment" name="edit[body]" tabindex="12" accesskey="c" rows="10" cols="30"><%edit_body></textarea></dd>
               <dt><label for="pass">パスワード:</label></dt>
               <dd><input id="pass" type="password" name="edit[pass]" tabindex="10" size="20"></dd>
               <dt><label for="secret">Secret:</label></dt>
               <dd><input id="secret" type="checkbox" name="edit[himitu]" tabindex="11">サイト管理者にのみ通知する</dd>
            </dl>
         </div>
         <div id="comments-open-footer" class="comments-open-footer">
            <input type="submit" tabindex="13" accesskey="s" id="comment-post" value="変更" />
            <input type="submit" tabindex="13" accesskey="s" name="edit[delete]" id="comment-post" value="削除" />
            <input type="reset" tabindex="14" value="クリア" />
         </div>
         <!-- コメント編集フォーム終了 -->
 
      </div><!-- /comments-open-content -->
   </div><!-- /comments-open -->
   </form>
 
</div>
<!--/edit_area-->
 
<!--trackback_area-->
　　　　　：

また、コメント編集へのリンクが必要ですので、コメント投稿者情報の部分に青色部分を追加してください。

<!-- コメント投稿者情報 -->
<p class="comment-footer">
   Posted by <a href="<%comment_url>"><%comment_name></a> at <%comment_year>.<%comment_month>.<%comment_day> <%comment_hour>:<%comment_minute> | <a href="<%comment_edit_link>" title="コメント編集のページへ">edit</a>
</p>

さらに、絵文字を挿入した場合の位置補正のため、スタイルシートに下記を追加してください。

.comment-content img {
    vertical-align: middle;
    padding:0 2px;
}

２．コメント投稿で絵文字が使えない不具合の修正

絵文字の表示は行っていたのですが、絵文字挿入用の JavaScript が正常に動作しておりませんでした。
これまでのテンプレートに変更を加える場合は、コメント投稿タグの comment-text という文字列を検索し、赤色の

<dt><label for="comment-text">コメント:</label></dt>
<dd><textarea id="comment-text" name="edit[body]" tabindex="12" accesskey="c" rows="10" cols="30"><%edit_body></textarea></dd>

を青色の

<dt><label for="comment">コメント:</label></dt>
<dd><textarea id="comment" name="edit[body]" tabindex="12" accesskey="c" rows="10" cols="30"><%edit_body></textarea></dd>

に変更してください。

またスタイルシートの赤色部分

#comment-text {
    width: 266px;
}

を青色の

#comment {
    width: 266px;
}

に変更してください。

３．コメントに絵文字を挿入するためのタグ設定

備忘録です。コメントに絵文字が挿入できる設定は、コメント投稿用 form 要素で

<form method="post" action="./" name="comment_form">

という青色の name 属性を設定し、textarea 要素の前等に

<script type="text/javascript" src="http://blogx.fc2.com/load.js"></script>

を設定し、textarea に

<textarea id="comment" name="comment[body]" cols="xx" rows="x"></textarea>

という青色部分の名称が comment となるように設定します。これでFC2ブログから提供されている JavaScript が、comment_form というフォームの中にある comment という id 属性名を検索し、絵文字用タグを埋め込みます）。
で、textarea タグの id 属性が comment-text となっていたため、正常に動作しておりませんでした。すいません。

設定方法の詳細は下記にありました。

ブログ管理者用お知らせ：ブログ管理者用お知らせ