名前の装飾 を使ってレイアウトが崩れてしまった場合の対応策
A. パスワード を 設定していて、該当する件数も少ない場合
ブログの 該当コメントから 「編集」 を選択し、（特に何もせず） 上書きをすればOK！ 更新されたコメントからはレイアウト崩れは直っているはずです。
当初、名前を変えたりしないとダメなのかと思っていましたが、実際にテストしてみたところ 単に 「編集」 送信 をするだけで大丈夫でした。 ということは、裏を返せば 「名前の装飾」 で付けた色は コメントを編集しちゃったら維持できないってことですよね。。。
B. パスワード を 設定しているが、該当する件数が多い場合
以下のいずれかの方法を選択してください。
- A. と同じ方法。 ひたすら 「編集」 → 送信 を繰り返す。 推奨
- 面倒なので、テンプレートを別のものに変更する。
- テンプレートから 「管理人のコメントを区別する機能」 をはずす。
- テンプレートの <!-- ▼記事へのコメント▼ --> 部分で使っている class設定 を
class="n_<%comment_name>" から class="T-<%comment_trip>" のような形に変更して使う。
<!-- ▼記事へのコメント▼ -->
<!--comment-->
<div id="comment<%comment_no>"
class="n_<%comment_name>"><br />
<div class="cm_body"><b><%comment_title></b><p><%comment_body></p></div>
<div class="t_right cm_bottom">
<%comment_mail+name> |
<script type="text/javascript"><!--
a="<%comment_url>";
if (a!="") document.write('<a href="'+a+'" target="_blank">URL</a> | ')
//--></script>
<%comment_year>/<%comment_month>/<%comment_day> (<%comment_wayoubi>) <%comment_hour>:<%comment_minute> <!--comment_edit-->[ <a href="<%comment_edit_link>" title="コメントの編集">編集</a> ]<!--/comment_edit--> No.<%comment_no>
</div><!--/class=t_right-->
</div><br /><!--/class=n_名前-->
<!--/comment-->
<!-- ▲記事へのコメント▲ -->
3. の場合、 class="n_<%comment_name>" を削除すればOK！
4. の場合、 class="T-<%comment_trip>" のように書き換える。
<%comment_trip> は、パスワードを暗号化した8文字（トリップ） を表示できる 変数 なのですが、これを使うには 自分のパスワードのトリップ を確認する必要があります。
[ 参考 ： てんぽ FC2ブログで管理人のコメントを区別して表示するカスタマイズ ]
C. パスワード を 設定していない場合
該当する件数にもよりますが．．．
- コメントの管理画面から 該当コメントを削除する。 （←件数が1・2件なら...）
- 面倒なので、テンプレートを別のものに変更する。
- テンプレートから 「管理人のコメントを区別する機能」 をはずす。 B.-3 参照
- これまでの分は諦めてそのまま使う。 今後、併用しなければOKです。
管理人のコメントにちょっとした背景画像を追加する方法
スタイルシートに 太字部分 を追加しただけです。 私は 横540px × 縦72px の画像を使っています。 なまえ 部分は書き換えて。
/* 管理人のコメントを区別 */
.n_なまえ {
color:#003366;
}
.n_なまえ .cm_body {
border:1px solid #ccccff;
background:url(http・・・/ひよこエンピツ.png) no-repeat right top;
}
最近のコメント一覧 （ナビゲーション部分） にも 「管理人のコメントを区別する機能」 を追加するためのカスタマイズ
ナビゲーションメニュー の中から <%rcomment_name> という変数を探し、それを <span class="r_n_<%rcomment_name>"><%rcomment_name></span> と変更します。 ↓ 丸ごと置き換えでもOK！
<!--==========区切り-->
<li>
<a href="./?xml&comment" class="navitop" target="_blank">Comments »<!--[if gte IE 7]><!--></a><!--<![endif]-->
<!--[if lte IE 6]><table><tr><td><![endif]--><ul>
<!--rcomment-->
<li>
<a href="<%rcomment_link>#comment<%rcomment_no>"><%rcomment_month>/<%rcomment_day>
<span class="r_n_<%rcomment_name>"><%rcomment_name></span><!--[if gte IE 7]><!--></a><!--<![endif]-->
<!--[if lte IE 6]><table><tr><td><![endif]--><ul>
<li><a href="<%rcomment_link>"><span class="sentence"><span><%rcomment_title></span><%rcomment_body> …</span><br />親記事 「<%rcomment_etitle>」 へ</a></li>
</ul><!--[if lte IE 6]></td></tr></table></a><![endif]-->
</li>
<!--/rcomment-->
<li><a href="./?xml&comment" title="コメントのRSSフィード" target="_blank">Comment RSS</a></li>
</ul><!--[if lte IE 6]></td></tr></table></a><![endif]-->
</li>
<!--==========区切り-->
スタイルシートに以下を 「追加」
.r_n_なまえ {
color:#0099cc;
}
#nav a:hover span.r_n_なまえ,
#nav li:hover > a span.r_n_なまえ {
color:#e0ffff;
}
※最後の 灰色部分 の設定にある :hover（マウスオーバー時など） の文字色 は IE6以下 だと上手く反映されないので 文字色（color:#0099cc; 部分） は選んだほうが無難です。
| プルダウン時 | （background:#ffffff）
color:#0099cc;
01/23 paruparu | （background:#ffffff）
color:#0099cc;
01/23 paruparu |
|---|
| マウスオーバー時 | （background:#006699）
color:#e0ffff
01/23 paruparu | IE6, IE5.5 だと文字色が
上の色（#0099cc）に...
01/23 paruparu |
|---|
[ 関連記事 ：
自作Webカラーチャート ColorChart349 ]
IE6 でも同じ表示になるもっと良い設定がありそうなのですが。。。
図2. のようなレイアウト崩れの原因 （詳細）
コメントの管理 → 返信 から 「名前の装飾」 を行った場合には、
<span class="fc2_owner_comment" style="color:#CC0000;">なまえ</span> などのようなタグが挿入されるのですが．．．このタグ、そのコメントの <%comment_name>（or <%comment_mail+name>） と <%rcomment_name> に相当する名前 に対して挿入しているようで、この仕様が テンプレート中の <div id="comment<%comment_no>" class="n_<%comment_name>"> の部分まで影響を及ぼし、
○ <div id="comment200" class="n_なまえ">・・・ で良いものが
× <div id="comment200" class="n_<span class="fc2_owner_comment" style="color:#CC0000;">なまえ</span>">・・・
と、文法的に間違った 変な形に書きかえられてしまう からのようです。
ちなみに、FC2ブログに 「名前の装飾」 機能が設置されたのは 2009年7月22日頃。 管理画面 からの返信 だけにしてあることで、「なりすましコメントの防止にも役立つ」 という意図もあるようです。
