WordPressやSymfonyのTipsを中心にアニメや日常の出来事について語ります。
メニュー

WordPressのコメント欄で管理者コメントだけ背景色を変更する方法

この記事は約2分15秒で読めます

鮮やかな色鉛筆
ゆっきー
ども、カフェブロガーの悠木です。 お気に入りのカフェはドトールコーヒーです。 14時からの限定スイーツ「シューシャポー」が大好きです。

ブログを書き続けているとコメントをもらえる機会が増えてきます。
管理者のコメントと読者のコメントが背景色で区別されていれば分かりやすいです。

Gravatorに登録して自分のアイコンを設定しておくとさらに良いです。

今回はWordPressで管理者のコメントとゲストユーザーのコメントを区別できるように背景色を変更する方法をご紹介します。

WordPressテーマで管理者コメントにclassが指定されている場合

WordPressテーマによっては管理者のコメントに既にクラスが指定されている場合があります。
例えば、私が使用しているN1テーマでは「admin-comment」「guest-comment」というクラスが指定されています。

この場合はスタイルシートに追記します。

スタイルシートを編集する

管理者は桜色でゲストユーザーは白色で表示しています。
※元々の背景色は白なのでゲストユーザーは色指定しなくても問題ないです。

WordPressテーマでクラス指定されていない場合

テーマによっては管理者とゲストユーザーの区別が設定されていないテーマもあります。
その場合は区別できるようにクラスを追加します。

テーマフォルダ内のコメントのテンプレートファイルを修正する

/wp-content/themes/使用中のテーマ/comments.php
上記のPHPファイルを編集します。

/wp-content/themes/使用中のテーマ/functions/comments.php
テーマによっては別ファイルに記載されている場合もあります。

コメントIDを出力している箇所を探す

<li id="comment-<?php comment_ID() ?>">

上記のようにコメントのIDを出力しているli要素を探します。

コメントを表示しているli要素にクラスを追加する

<?php ... ?> までソースを<li class=""のクラス内に追加してください。

comment, clearfix等のclass名がテーマによって既に指定されている場合もあります。
元々の記述を削除しないように注意して追加してください。

上記のソースではコメントのメールアドレスと記事投稿者のメールアドレスを比較しています。
一致したら管理者コメントクラスを追記するようにしています。その他のコメントはゲストコメントの指定です。

記事投稿者ではなく特定のユーザーのコメントの色を指定したい場合は
get_the_author_meta('email', 1)と引数でユーザーIDを指定してあげればOKです。

複数指定したい場合はif文を追加しましょう!

スタイルシートを編集する

スタイルシートにコメントの背景色の設定を追記します。

投稿ユーザー別にコメントの背景色を変更したい場合

記事の投稿者が複数人いてそれぞれのコメントで色分けしたい場合の方法です。
まず需要はないと思いますが面白そうだったのでやってみました。

カラフルなコメント欄にしたい人はやってみてください。

実際のゆとりっちのコメント欄の表示

ゆとりっちのコメント欄は下記のコメントを確認してみてください。
背景色を変更するだけだと違和感があったので、枠線や余白を追加しております。

参考サイト

関連記事

  1. 虫眼鏡
  2. クッキー 型抜き
  3. ワードプレス Browser Shots rel nofollow
  4. Gravator
  5. STINGER5カスタマイズ 一覧ページを2列で表示する
  6. N1 mono-lab

PR

カテゴリー