【WordPress】シンプルな返信機能付きコメントフォームと、一覧ページにコメント一覧を設置する

設置する機会があったので備忘録。
手っ取り早く、シンプルな返信機能付きのコメントが必要なときに使えます。

完成形はこちら。
投稿ページがこれで、

トップページなどに設置する一覧表示がこちら。

下記条件にてカスタマイズした。

  • アバターなし
  • 入力欄は名前、メアド、本文の3つのみ
  • モデレーション(承認待ち)処理なし
  • 返信されたコメントは全て共通で、左側に余白(margin-left: 1em;)

 

骨組みテーマ「Bones」からファイルとコードを流用

「Bones」公式サイトから一式をダウンロードして、

  • comments.php
  • functions.php

だけ残し、他は全て削除。
ちなみに、WordPressテーマをBonesで構築していなくても問題なし。

 

single.php に呼び出しコードを記載する

divとidは、後ほどCSSで整形する用。

 

comments.php をカスタマイズ

元コードを下記に修正した。

 

functions.php のコメント用コードをカスタマイズ

元コードを下記に修正した。

 

functions.php にコードを追加していく

入力欄の順番を名前、メアド、本文に

 

URL入力欄を削除

 

メールアドレス欄を空白に、名前欄にプレースホルダ

 

デフォルト文言の変更

 

投稿者名が無記名の場合のデフォルト名

 

リンクを別窓に

 

HTML入力を無効化

 

投稿ページのコメントフォームをCSSで整形

 

トップページなどに「投稿されたコメント」を一覧表示

全てのコメントを表示させたいときは、number を0に。
HTMLタグは適当。

 

一覧表示をCSSで整形

 

参考サイト

    • このエントリーをはてなブックマークに追加