コメントフォーム・リストのカスタマイズ

コメント投稿部分は、基本的にはどのテーマでも同じフォームを出力してテーマのstyle.cssで外観を変えています。コメントフォーム欄をカスタマイズするには、プラグインもしくはフックを用いてカスタマイズを行います。
目次(コメントフォーム)
- 「ウェブサイト」フィールドを除外する
- コメントフォーム部分を変更する
- コメントフォーム内の注意書きを変更する
目次 (コメントリスト)
- 管理画面から設定できる項目
- コメント投稿者にリンクを付与しない
- 自動リンクを無効化する
- コメントの投稿日付・時間を削除
コメントフォームのカスタマイズ
「名前」「メールアドレス」「ウェブサイト」フィールドを除外する
コメントフォームには、デフォルトでは"名前(Name)"、"メールアドレス(Email)"、"ウェブサイト(Website)"が用意されています。
"ウェブサイト"にurlを入れて投稿された場合はコメント投稿者の"名前"にそのURLがリンクされます。
それぞれ非表示にする項目を選んで実装して下さい。
// functions.php(子テーマ)に追加 // オリジナル comment_form in wp-includes/comment-template.php function my_comment_form_fields( $fields){ unset( $fields['author']); // 「名前」を非表示にする場合 unset( $fields['email']); // 「メールアドレス」を非表示にする場合 unset( $fields['url']); // 「ウェブサイト」を非表示にする場合 return $fields; } add_filter( 'comment_form_default_fields', 'my_comment_form_fields');
「ウェブサイト」フィールドを除外するプラグイン
Disable/Hide Comment URL
コメントフォーム部分を変更する
「名前」「メールアドレス」「ウェブサイト」フィールド
変更する場合は、fucntions.php(子テーマ)で以下のように定義してauthor、email、urlの内容を書き換えます。例としてラベルを削除してプレースホルダーを入れてみます。
// functions.php(子テーマ)に追加 // オリジナル comment_form in wp-includes/comment-template.php add_filter( 'comment_form_default_fields', 'my_comment_form_default_fields'); function my_comment_form_default_fields($fields){ $commenter = wp_get_current_commenter(); $req = get_option( 'require_name_email' ); // 「名前」「メールアドレス」必須オプション $aria_req = ( $req ? " aria-required='true'" : '' ); // aria-required='trueの付与有無 $fields = array( // 名前 'author' => '<p class="comment-form-author">' . '<input id="author" name="author" type="text" placeholder="' . __( 'Name' ) . '" value="' . esc_attr( $commenter['comment_author'] ) . '" size="30"' . $aria_req . ' />' . ( $req ? '<span class="required">*</span>' : '' ) . '</p>', // メールアドレス 'email' => '<p class="comment-form-email">' . '<input id="email" name="email" type="text" placeholder="' . __( 'Email' ) . '" value="' . esc_attr( $commenter['comment_author_email'] ) . '" size="30"' . $aria_req . ' />' . ( $req ? '<span class="required">*</span>' : '' ) . '</p>', // URL(ウェブサイト) 'url' => '<p class="comment-form-url">' . '<input id="url" name="url" type="text" placeholder="' . __( 'Website' ) . '"value="' . esc_attr( $commenter['comment_author_url'] ) . '" size="30" /></p>', ); return $fields; }
「コメント」フィールド
変更する場合は、fucntions.php(子テーマ)で以下のように定義してcomment_fieldの内容を書き換えます。例としてラベルを削除してプレースホルダーを入れてみます。
// functions.php(子テーマ)に追加 // オリジナル comment_form in wp-includes/comment-template.php add_filter( "comment_form_defaults", "my_comment_form_defaults"); function my_comment_form_defaults($defaults){ // 'comment_field' => '<p class="comment-form-comment"><label for="comment">' . _x( 'Comment', 'noun' ) . '</label><textarea id="comment" name="comment" cols="45" rows="8" aria-required="true"></textarea></p>', $defaults['comment_field'] = '<p class="comment-form-comment"><textarea id="comment" name="comment" cols="45" rows="8" aria-required="true" placeholder="' . _x( 'Comment', 'noun' ) . '"></textarea></p>'; return $defaults; }
コメントフォーム内の注意書きを削除・変更する
「次のHTML タグと属性が使えます: ~」を削除
コメントフォーム下に表示される注意書きみたいなもの("form-allowed-tags")を非表示にします。
Webマスターツールの「コンテンツ キーワード」で”cite”とか”title”などのキーワードがなぜか上位にきたりします。この部分に1記事2つも3つも付くからでは と思い、消しました。CSSで消す方法もあるのですが、それだとインデックスに拾われてしまうので完全に削除することにします。
// 子テーマのfucntions.phpに追加して下さい。 add_filter( "comment_form_defaults", "my_comment_notes_after"); function my_comment_notes_after( $defaults){ $defaults['comment_notes_after'] = ''; return $defaults; }
CSSで削除する
/* 子テーマのstyle.phpに追加して下さい。*/ #respond .form-allowed-tags { display: none; }
「コメントを残す」を削除
「メールアドレスが公開されることはありません。 * が付いている欄は必須項目です」を削除
// 子テーマのfucntions.phpに追加して下さい。 // オリジナル comment_form in wp-includes/comment-template.php add_filter( "comment_form_defaults", "my_comment_notes_before"); function my_comment_notes_before( $defaults){ $defaults['comment_notes_before'] = ''; return $defaults; }
文言を変更する場合は、$defaults['title_reply']に対象の文章を入れて下さい。
.comment-notes { display: none; }
コメントリストのカスタマイズ
管理画面から設定できる項目
管理画面の「設定」→「ディスカッション」へとすすみ以下の設定を行うことができます。
他のコメント設定
スレッド表示
"コメントをxx階層までのスレッド (入れ子) 形式にする"
コメントに対して「返信」リンクから投稿された場合は、1つのディスカッションとしてスレッド表示されます。
ページネーション
"1ページあたりxxx件のコメントを含む複数ページに分割し、xxxのページをデフォルトで表示する"
設定によりコメント表示のページネーションをしてくれます。
コメントの表示順
"xxxコメントを各ページのトップに表示する"
承認されたコメントの表示順を設定します。"古い"→昇順もしくは"新しい"→降順に表示
コメント投稿者にリンクを付与しない
以下のプラグインでは、「ウェブサイト」フィールドは除外しません(入力してもらう)が、「名前」にリンクが付与されません。
Disable comment author links
自動リンクを無効化する
コメント内にURLがあると自動的にリンクが生成されます。その機能を無効化します。
remove_filter( 'comment_text', 'make_clickable', 9);
コメントの投稿日付・時間を消す
コメントの投稿日と投稿時間を消します。
// 子テーマのfunctions.phpに追加 add_filter( 'get_comment_date', '__return_false', 10, 2); // 日付を非表示 add_filter( 'get_comment_time', '__return_false', 10, 2); // 時間を非表示
その他、コメント表示部分に関わるカスタマイズ
関連記事
-
-
Twenty Fourteen "コメントをどうぞ"の非表示と変更方法
Twenty Fourteenでは、デフォルトで投稿ページと各アーカイブページの各投稿のメタ情報欄に「コメントをどうぞ」というコメントフォームへのリンクが設置されます。 それぞれ、コメントが0件の場
-
-
jQueryをCDNから読み込む
WordPressではデフォルトでjQueryライブラリが同梱されています。この記事では、それをやめて、CDNから読み込み、使用する方法を解説します。 WordPress 3.6 3.9 4.0
-
-
Tumblrの投稿をウィジェットに表示できる「Tumblr Widget」
このブログでは、サイドバーウィジェットに「Tumblr」に投稿したブックマーク一覧を表示させています。プラグインは「Tumblr Widget」を使用しています。ダウンロード 「This plugi
-
-
管理画面のCSSをカスタマイズ
管理画面のスタイルを変更したくなったので、カスタマイズしてみました。一例として以下を取り上げてみます。 「投稿一覧」の画面でカスタムフィールドが追加されていくと、そんなに幅が必要のないところが長くな
-
-
「Google Analytics for WordPress」投稿URLにやたら長いパラメータがついてしまう
Google 検索結果をみていたら、Wordpressの投稿のURLが実際のものより異様に長くなっているので何かなと思って調査してみました。 このような感じで http://kwski.net/ca
-
-
Lightbox (画像ポップアップ) プラグイン
WordPressで使用できるLightbox(画像ポップアップ)プラグインのまとめ ひとまずインストール・有効化するだけで使用可能です。(3.7/3.8/3.9) blueimp lig
-
-
ブルー・オレンジ・ピンクと選べるテーマ「Bouquet」をカスタマイズ
プレビューはこちら ダウンロード 目次 ヘッダー画像の高さを変更 アイキャッチをアップロード h1タグがやたら多いので最適化 画像をレスポンシブ対応 フォント「Sorts Mill
-
-
アバターサイズの変更など Twenty Twelve 1.3での変更点
Twenty Twelve 1.3 での変更点 アバターサイズの設定ロジック変更 ヘッダ画像の設定ロジック変更 全ての変更点はこちら Changes from twentytwel
-
-
サイトのキャプチャをショートコードで生成してくれる「Browser Shots」
外部のサイトを紹介する際にそのサイトのキャプチャが添えられているとイメージがつかみやすくなりクリックのモチベーションが上がるような気がします。 今回は、ショートコード一行でサイトのスクリーンショット
-
-
JSやCSSに自動で付与されるバージョン番号を非表示に
Wordpressでは、JSやCSSがロードされる際にlinkタグやscriptタグ内にWordpressやプラグインもしくはスクリプトそのもののバージョン番号が付与されます。「?ver=」で検索して
Comment
[…] 参照:http://kwski.net/wordpress/1060/ […]
素敵な記事! 読みやすい!
コメントフォーム
ううっphpいじるのこわいなー
WordPress - コメントフォーム・リストのカスタマイズ : https://t.co/TCozjmGLtu
コメントフォーム・リストのカスタマイズ https://t.co/qs0aa8sr6z
[…] 参考 WordPress | コメントフォーム・リストのカスタマイズ […]
[…] コメントフォーム・リストのカスタマイズ […]
[…] Think deeply, Do less, More effective コメントフォーム・リストのカスタマイズ […]
WordPressのコメントフォームのカスタマイズはここが非常に参考になりました。URLやメールの入力欄を削除するなど。ちなみにStinger使ってます。 RT コメント部分のカスタマイズ http://t.co/MB1IRkS7Hy
[…] http://kwski.net/wordpress/1060/ […]
[...] この記事が参考になりました。 http://kwski.net/wordpress/1060/ [...]