WordPressのコメントとトラックバックを分けてカスタマイズ

WordPressのコメントとトラックバックを分けてカスタマイズ

かなり長いことああでもないこうでもないとやっていましたが、やっと形になったっぽいです。2.X系でのカスタマイズ方法は良く目にするんですが、3.X系だとちょっと違うようで悩み抜きました。


2014/5/29追記

こちらの記事は2012年に書かれたものなので情報が古い可能性があります。

Ver3.9.1現在では single.php にて

という記述でコメントを読み込みますが、テーマ内に comments.php が存在する場合はそちらが優先され、存在しない場合は wp-includes/theme-compat/ 内の comments.php を読み込んでいます。カスタマイズしたい場合は、こちらのファイルをコピーして自テーマ内に入れて、そちらを変更していくのが良いと思います。

以下、当時の情報ですがご参考になりそうなところがあれば幸いです。

今のデザインだとこんな感じ。

120427-1

CSSで見た目を変えることはできていても、コメントとトラックバック(ピンバック)を分けたり、もうちょっとカスタマイズしたいな…っていう気持ちがむくむくと。

120427-2

具体的に言えば、こんな風に。というわけで、やってみます!

comments.phpを作成

まっさらなエディタにこんな感じで書いて、comments.phpという名前で保存。

1~5行目は、直接アクセスを禁止したり保護をかける時用。そこから下は、have_comments()でコメント/トラックバック(ピンバック)があるときだけ出力されるようになっています。

これで、さっきのsingle.phpのcomments_template();がこちらを呼び出してくれるようになります。でもこれだけじゃ動きません!いくつか関数を呼び出しているので、functions.phpに記述が必要です。

コメント数だけを取得する関数

9行目のget_comment_only_number();で呼び出す関数をfunctions.phpへ記述。

  • 後から知ることが多いWordPressお役立ちスニペット9つ -Webデザインレシピ

Webデザインレシピさんのコードを参考にさせていただき、手を加えました。WPデータベースのwp_commentsテーブルの情報を取ってきているわけですが、トラックバックやピンバックはcomment_typeフィールドに’trackback’, ‘pingback’が入り、通常コメントは値なしとのことなので、それを条件にします。あとcomment_approvedが1で「承認済み」です。

コメント部分のhtmlを成形する関数

14行目、callback=mytheme_commentで呼び出す関数をfunctions.phpへ記述。

トラックバック部分のhtmlを成形する関数

21行目、callback=mytheme_pingsで呼び出す関数をfunctions.phpへ記述。

※現在当サイトで使っているテーマでは、9行目のコメント部分を抜いてあります。

こちらのサイトのコードを参考に作らせて頂きました、ありがとうございます!

忘れちゃいけないstyle.css

PHPによってはき出してもらったhtmlを装飾します。

120427-3

さて、これでこんな感じになったと思います。でも、このままじゃ投稿フォームがありません

投稿フォームを追加

先程のcomments.phpの一番最後に、

と記述するだけであら素敵!投稿フォームが自動で出力されます!

120427-4

されるんですが…このままだとなんだかちょっともっさり感…。こちらもカスタマイズしたいところです。

さっきのcomments.phpの後ろに追記

comment_form()は元々$defaults = array()という要素を持っているので、その中の変えたいところだけ設定して、comment_form( $defaults )として読み込んであげるとそこだけ上書きされますよー、ということだと思います。

分かりにくいとは思いますが、私は上記のコードで、

  • フォーム上下のコメント(公開されません・必須ですとか、タグが使えます)を消す
  • 各フォームのラベル(名前・メールアドレスなど)をちょこっといじる
  • ラベルとフォームの間に改行

ということをしています。

こちらのサイトが分かりやすいです!

120427-5

こんな感じになりました!

時間はかかったけど勉強になりました

そもそもWordPressではコメントとトラックバックの区別がないと言ってるのに、どうにかして分けたいという我侭w どなたかの参考になれたら幸いです。むしろ間違ってるところとかありましたらご連絡頂けると嬉しいです。

公開日:2012/04/27
更新日:2014/05/29

4件のピンバック

  1. WordPressテーマ作成に役立つ記事&学んだことまとめ(テーマ作成編)

    もはや全く新しい話でも何でもないのですが、先月オリジナルテーマを作成してサイトのデザインを変更しました。 WordPressのテーマ作成は自分にとってはとても難しく、色々なブログの…

  2. […] WordPressのコメントとトラックバックを分けてカスタマイズ *Ateitexe […]

  3. […] これは、*youさんの記事(WordPressのコメントとトラックバックを分けてカスタマイズ *Ateitexe)を参考に、ちょっと自分用にカスタマイズして利用させていただきました。 […]

  4. […] す。 このメソッドにコールバックを渡せば、出力用のhtmlをカスタマイズできます。 カスタマイズの方法は以下が詳しいです。 WordPressのコメントとトラックバックを分けてカスタマイズ […]

4件のコメント

  1. Oxy より:

    とりあげていただいてありがとうございます。
    足跡残しと、動作テストにw

    • you より:

      動作テスト、ありがとうございます!
      ちゃんと動いてるでしょうかw

  2. ほしゃしゃ より:

    ありがとうございました!助かりました!
    twentytwelveのコメントをカスタマイズしてみたものの、どうもしっくりいかず。

    • *you より:

      ほしゃしゃさん、コメントありがとうございます!
      お役に立てて光栄ですー(*´ω`*)


コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

このサイトはスパムを低減するために Akismet を使っています。コメントデータの処理方法の詳細はこちらをご覧ください

当サイトはスパム対策のため Akismet プラグインを利用しています。コメントデータの処理方法はこちらをご参照ください。

コメントは承認制ですので、反映までしばらくお待ち下さい。(稀にですがスパムの誤判定にて届かないこともあるようですので、必要な際はお問い合わせからお願い致します。)