おかぴーです。
記事のコメント欄にちょっとした文言を追加したい場合のカスタマイズ方法を今回はご紹介しようと思います。
例えば、僕のコメント欄の場合は↓２つのファイルを使って対応しています。
- THE THORのテーマ内のPHPファイル
- WordPressのテンプレートファイル
②のファイルは、どのWordPressテーマを使っていても共通のファイルになるので、カスタマイズの参考になると思いますよ。
みみこ他のテーマを使っていてもカスタマイズできるのはいいですね♪
おかぴー一言添えるだけで印象も変わりますよね♪
では、さっそく本題へ↓
では、さっそく本題へ↓
カスタマイズする時は、バックアップをとってから行ってください。カスタマイズについては必ず自己責任でお願いいたします。
目次
THE THORのファイル
「wp-content > themes > the thor > comments.php」
↑にあるcomments.phpファイルを使います。
ただし、親テーマではなく、必ず子テーマに複製してから、
「wp-content > themes > the thor child > comments.php」
のファイルを編集しましょう。
＜親テーマの場所（右上がTHE THOR）＞
＜子テーマの場所（右上がTHE THOR CHILD）＞
- FTPソフトを利用して子テーマに複製します。やり方を知りたい方はこちら↓
- あわせて読みたい
親テーマから子テーマにカスタマイズするファイルをダウンロードする方法 子テーマの設定と、親テーマから子テーマにカスタマイズしたいファイルをダウンロード・アップロードする方法をわかりやすく解説！
<?php $args = array(
‘title_reply’ => ‘コメントを書く‘,
‘label_submit’ => __( ‘コメントを送信’ , ‘default’ ),
‘title_reply_before’ => ‘<h2 class=”heading heading-secondary”>’,
‘title_reply_after’ => ‘</h2>’,
);
comment_form( $args ); ?>
‘title_reply’ => ‘コメントを書く‘,
‘label_submit’ => __( ‘コメントを送信’ , ‘default’ ),
‘title_reply_before’ => ‘<h2 class=”heading heading-secondary”>’,
‘title_reply_after’ => ‘</h2>’,
);
comment_form( $args ); ?>
コード内の赤文字のところを、↓のようにしています。
<?php $args = array(
‘title_reply’ => ‘コメントもらえると嬉しいです(o^^o)‘,
‘label_submit’ => __( ‘コメントを送信’ , ‘default’ ),
‘title_reply_before’ => ‘<h2 class=”heading heading-secondary”>’,
‘title_reply_after’ => ‘</h2>’,
);
comment_form( $args ); ?>
‘title_reply’ => ‘コメントもらえると嬉しいです(o^^o)‘,
‘label_submit’ => __( ‘コメントを送信’ , ‘default’ ),
‘title_reply_before’ => ‘<h2 class=”heading heading-secondary”>’,
‘title_reply_after’ => ‘</h2>’,
);
comment_form( $args ); ?>
WordPressのテンプレートファイル
今度は、WordPress共通で使われている↓のファイルを使います。
「wp-includes > comment-template.php」
子テーマとかはないので、同じ箇所に上書きをするので、こちらも必ずバックアップを取って上書きしましょう^^
最初は↓のようになっています（コードの一部を抜粋）。
$fields = array(
‘author’ => ‘<p class=”comment-form-author”>’ . ‘<label for=”author”>’ . __( ‘Name’ ) . ( $req ? ‘ <span class=”required”>*</span>‘ : ” ) . ‘</label> ‘ .
‘<input id=”author” name=”author” type=”text” value=”‘ . esc_attr( $commenter[‘comment_author’] ) . ‘” size=”30″ maxlength=”245″‘ . $html_req . ‘ /></p>’,
‘email’ => ‘<p class=”comment-form-email”><label for=”email”>’ . __( ‘Email’ ) . ( $req ? ‘ <span class=”required”>*</span>’ : ” ) . ‘</label> ‘ .
‘<input id=”email” name=”email” ‘ . ( $html5 ? ‘type=”email”‘ : ‘type=”text”‘ ) . ‘ value=”‘ . esc_attr( $commenter[‘comment_author_email’] ) . ‘” size=”30″ maxlength=”100″ aria-describedby=”email-notes”‘ . $html_req . ‘ /></p>’,
‘url’ => ‘<p class=”comment-form-url”><label for=”url”>’ . __( ‘Website’ ) . ‘</label> ‘ .
‘<input id=”url” name=”url” ‘ . ( $html5 ? ‘type=”url”‘ : ‘type=”text”‘ ) . ‘ value=”‘ . esc_attr( $commenter[‘comment_author_url’] ) . ‘” size=”30″ maxlength=”200″ /></p>’,
);
‘author’ => ‘<p class=”comment-form-author”>’ . ‘<label for=”author”>’ . __( ‘Name’ ) . ( $req ? ‘ <span class=”required”>*</span>‘ : ” ) . ‘</label> ‘ .
‘<input id=”author” name=”author” type=”text” value=”‘ . esc_attr( $commenter[‘comment_author’] ) . ‘” size=”30″ maxlength=”245″‘ . $html_req . ‘ /></p>’,
‘email’ => ‘<p class=”comment-form-email”><label for=”email”>’ . __( ‘Email’ ) . ( $req ? ‘ <span class=”required”>*</span>’ : ” ) . ‘</label> ‘ .
‘<input id=”email” name=”email” ‘ . ( $html5 ? ‘type=”email”‘ : ‘type=”text”‘ ) . ‘ value=”‘ . esc_attr( $commenter[‘comment_author_email’] ) . ‘” size=”30″ maxlength=”100″ aria-describedby=”email-notes”‘ . $html_req . ‘ /></p>’,
‘url’ => ‘<p class=”comment-form-url”><label for=”url”>’ . __( ‘Website’ ) . ‘</label> ‘ .
‘<input id=”url” name=”url” ‘ . ( $html5 ? ‘type=”url”‘ : ‘type=”text”‘ ) . ‘ value=”‘ . esc_attr( $commenter[‘comment_author_url’] ) . ‘” size=”30″ maxlength=”200″ /></p>’,
);
↑の赤文字のところを編集。
「ニックネームでもOKですよ〜」と<span></span>の間にテキスト入力し表示させています。
また、「<br>」を挟むことで、改行させています。
‘author’ => ‘<p class=”comment-form-author”>’ . ‘<label for=”author”>’ . __( ‘Name’ ) . ( $req ? ‘ <span class=”required”>*<br>ニックネームでもOKですよ〜</span>‘ : ” ) . ‘</label> ‘ .
‘<input id=”author” name=”author” type=”text” value=”‘ . esc_attr( $commenter[‘comment_author’] ) . ‘” size=”30″ maxlength=”245″‘ . $html_req . ‘ /></p>’,
‘<input id=”author” name=”author” type=”text” value=”‘ . esc_attr( $commenter[‘comment_author’] ) . ‘” size=”30″ maxlength=”245″‘ . $html_req . ‘ /></p>’,
おかぴー小さな「 . 」が一つでも抜けるとエラーになるので注意してください。
また、上記コード内のそれぞれの対応部分をまとめると、↓のようになっています。
- ‘author’：「名前」欄
- ‘email’：「メール」欄
- ‘url’：「サイト」欄
例えば、↓のようなコメント欄を作る場合は、
‘email’ => ‘<p class=”comment-form-email”><label for=”email”>’ . __( ‘Email’ ) . ( $req ? ‘ <span class=”required”>*</span>’ : ” ) . ‘</label> ‘ .
‘<input id=”email” name=”email” ‘ . ( $html5 ? ‘type=”email”‘ : ‘type=”text”‘ ) . ‘ value=”‘ . esc_attr( $commenter[‘comment_author_email’] ) . ‘” size=”30″ maxlength=”100″ aria-describedby=”email-notes”‘ . $html_req . ‘ /></p>’,
‘<input id=”email” name=”email” ‘ . ( $html5 ? ‘type=”email”‘ : ‘type=”text”‘ ) . ‘ value=”‘ . esc_attr( $commenter[‘comment_author_email’] ) . ‘” size=”30″ maxlength=”100″ aria-describedby=”email-notes”‘ . $html_req . ‘ /></p>’,
↓
‘email’ => ‘<p class=”comment-form-email”><label for=”email”>’ . __( ‘Email’ ) . ( $req ? ‘ <span class=”required”>*</span>’ : ” ) . ‘アドレス</label> ‘ .
‘<input id=”email” name=”email” ‘ . ( $html5 ? ‘type=”email”‘ : ‘type=”text”‘ ) . ‘ value=”‘ . esc_attr( $commenter[‘comment_author_email’] ) . ‘” size=”30″ maxlength=”100″ aria-describedby=”email-notes”‘ . $html_req . ‘ /></p>’,
‘<input id=”email” name=”email” ‘ . ( $html5 ? ‘type=”email”‘ : ‘type=”text”‘ ) . ‘ value=”‘ . esc_attr( $commenter[‘comment_author_email’] ) . ‘” size=”30″ maxlength=”100″ aria-describedby=”email-notes”‘ . $html_req . ‘ /></p>’,
‘url’ => ‘<p class=”comment-form-url”><label for=”url”>’ . __( ‘Website’ ) . ‘</label> ‘ .
‘<input id=”url” name=”url” ‘ . ( $html5 ? ‘type=”url”‘ : ‘type=”text”‘ ) . ‘ value=”‘ . esc_attr( $commenter[‘comment_author_url’] ) . ‘” size=”30″ maxlength=”200″ /></p>’,
‘<input id=”url” name=”url” ‘ . ( $html5 ? ‘type=”url”‘ : ‘type=”text”‘ ) . ‘ value=”‘ . esc_attr( $commenter[‘comment_author_url’] ) . ‘” size=”30″ maxlength=”200″ /></p>’,
↓
‘url’ => ”,
→url欄は、「 ” 」シングルクォーテーションを残して、中身を削除すると表示されなくなります。
いかがでしたでしょうか。
コメント欄の使い方次第では、あなたのファンが増えるきっかけを作ることができるので、
ぜひあなただけのコメント欄を作って、読者の方とのコミュニケーションを楽しんでみてくださいね(*^^*)
コメント