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 どなたかの参考になれたら幸いです。むしろ間違ってるところとかありましたらご連絡頂けると嬉しいです。

  • このエントリーをはてなブックマークに追加
  • follow us in feedly 641
  • RSSを登録

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


4件のコメント

  • Oxy
    2012年4月27日 7:07 PM

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

    • you
      2012年4月27日 8:26 PM

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

  • ほしゃしゃ
    2014年6月12日 1:40 PM

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

    • *you
      2014年6月13日 9:03 AM

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

5件のトラックバック

コメントを残す




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


back to top