WordPressコメント入力フォームの「名前」「メールアドレス」「サイト」のテキストを変更するカスタマイズ方法

サイバーマンデー
Amazonプライム会員限定の大セール「サイバーマンデー」開催中!プライム会員限定の大セール

サブサイトのフォーラムにコメント入力欄のカスタマイズについて以下のような質問がありました。

コメント欄のカスタマイズでこちらにたどり着きました。

やりたいことはシンプルに、コメント入力欄や名前入力欄の上部のテキストを「コメントをどうぞ」→任意のテキストに変更したい「名前」→「お名前」や「ニックネーム」、「ペンネーム」などサイトによって任意に変更したいという感じです。

こういった、コメント欄カスタマイズ方法の質問は、これまで何度かあるので一定の需要があるのかと、この機会にやり方を記しておこうと思います。

今回のカスタマイズで変更できる部分は、以下のテキスト部分です。

コメント入力フォームの変更するテキスト

スポンサーリンク
レクタングル(大)広告

主な手順

コメント欄テキストのカスタマイズ方法の主な手順は以下です。

  1. テーマ内からcomment_form関数が使われている場所を探す
  2. comment_form関数部分を編集する

今回は、Wordpress公式テーマのTwenty Sixteenを例にカスタマイズ方法を紹介したいと思います。

今回は、Twenty Sixteenのカスタマイズ方法ですが、基本的にどのテーマでも同じ手順で変更できるかと思います。

テーマ内からcomment_form関数が使われている場所を探す

まずは、テーマ内でcomment_form関数が使われている部分を探します。

探すのには、テキストエディターのGrep検索などで「comment_form」というテキストを検索してみてください。

Sublime Textでの検索方法

僕が使用しているSublime Text 3だと、メインメニューの「Find」から「Find in Files(Ctrl + Shift + F)」から、Grep検索フォームを表示させて、「comment_form」を検索してださい。

Sublime Textで「comment_form」をGrep検索する

すると、以下のような検索結果が表示されます。

Sublime TextでGrep検索結果

Twenty Sixteenの場合は、comments.phpテンプレートに記入されていました。

EmEditorでの検索方法

一応、日本語エディターのEmEditorでの方法も書いておきます。

EmEditorメインメニューの「検索」から「ファイルから検索(Ctrl + Shift + F)」を選択してください。

EmEditorでGreg検索

大抵のプログラム用エディターには、この一括検索機能がついているかと思います。

comment_form関数部分を編集する

今回の例として使用しているTwenty Sixteenの場合は、comments.phpテンプレートにcomment_form関数が記入されていました。

なので、親テーマのcomments.phpをコピーして、子テーマフォルダ直下に貼り付けてください。そして子テーマにコピペしたファイルをエディターなどで開いてください。

ここで、「なぜ子テーマにファイルをコピーするのか?」については以下を参照してください。

Wordpressテーマのカスタマイズで子テーマを使うべき理由、使い方など
Wordpress既存テーマをカスタマイズするなら子テーマを使うべきと思います。 これは、Wordpress codexにある...
親テーマを直接カスタマイズする場合は、以降はcomments.phpを直接編集してください。

大抵のテーマの場合は、comment_form関数は、以下のように利用されています。

この部分を、以下のようにコピペで書き換えます。

先頭の方にある$name、$mail、$siteのテキストについては好みのものに変更してください。

comment_form関数に引数があらかじめ設定されていた場合

今回の例として使用しているTwenty Sixteenの場合、comment_form関数に以下のような引数が設定されていました。

こういった場合は、引数にもともとあった設定項目も取り入れて、以下のように記入します。

動作確認

今回のカスタマイズで、デフォルトの日本語環境だと「名前」、「メールアドレス」、「サイト」であったコメント入力フォームのテキストが以下のように変更されました。

コメントフォームカスタマイズ後

まとめ

コメントフォームのカスタマイズは、通常のテンプレートファイルのカスタマイズと違い、ちょっと分かりづらいかもしれません。

ただ、やり方さえ分かってしまえば、comment_form関数で指定する引数の内容を指定するだけなので、いろいろなカスタマイズができるかと思います。

このコメントフォームのカスタマイズについては、WordPress Codexの関数リファレンス/comment formがサンプルも豊富で分かりやすいかと思います。

僕も今回は、Codexの「デフォルト $args 配列」項目にあるデフォルト配列をコピペして不要な部分を削除し、必要な部分だけ編集しました。

この、デフォルト配列さえ分かっていれば、いろいろと応用が利くかと思います。