ウェブサイトのWordPressコメントフォームのスタイルを変更したいですか？ WPBeginnerでは、ユーザーエンゲージメントを高めるためのさまざまな方法を長年試しており、見た目が良く、使いやすいコメントフォームが 大きな 違いを生むことを発見しました。
コメントは、ウェブサイトでのユーザーエンゲージメントを構築する上で重要な役割を果たします。ユーザーがコメントを残しやすく、視覚的に魅力的にすることで、ウェブサイトでのさらなる議論とインタラクションを促進します。
この記事では、WordPressのコメントフォームを簡単にスタイル設定して、ウェブサイトのエンゲージメントを高める方法をご紹介します。
開始する前に
WordPressテーマはウェブサイトの外観を制御します。各WordPressテーマには、テンプレートファイル、functionsファイル、JavaScript、スタイルシートなど、いくつかのファイルが含まれています。
スタイルシートには、WordPressテーマが使用するすべての要素のCSSルールが含まれています。テーマのスタイルルールを上書きするために、独自のカスタムCSSを追加できます。
これが初めての場合は、初心者向けのWordPressでカスタムCSSを追加する方法に関する記事をご覧ください。
CSS以外にも、WordPressのコメントフォームのデフォルトの外観を変更するためにいくつかの関数を追加する必要がある場合があります。以前にこれを行ったことがない場合は、WordPressにウェブ上のスニペットを貼り付けるための初心者ガイドに関する記事をご覧ください。WordPressでコードをコピーして貼り付ける方法。
それでは、WordPressのコメントフォームのスタイル設定方法を見ていきましょう。
このガイドは非常に包括的であるため、ナビゲーションを容易にするために目次を作成しました。
- SeedProdテーマビルダーを使用したWordPressコメントフォームのスタイリング
- Change WordPress Comments with Default CSS Classes
- WordPressコメントへのソーシャルログインの追加
- WordPressコメントフォームにコメントポリシーテキストを追加する
- コメント入力欄を下に移動
- WordPressコメントフォームからウェブサイト（URL）フィールドを削除する
- WordPressでコメント購読チェックボックスを追加する
- WordPressコメントフォームにカスタムフィールドを追加
SeedProdテーマビルダーを使用したWordPressコメントフォームのスタイリング
この方法では、市場でSeedProdが必要となります。これは市場で最高のWordPressページおよびテーマビルダープラグインです。
コーディング経験のない初心者におすすめです。ただし、この方法の欠点は、既存のWordPressテーマがカスタムテーマに置き換わることです。
まず、SeedProd プラグインをインストールして有効化する必要があります。詳細については、WordPress プラグインのインストール方法に関するステップバイステップガイドをご覧ください。
注意：テーマビルダー機能にアクセスするには、PROプラン以上が必要です。
有効化したら、カスタムWordPressテーマ用のテンプレートを作成する必要があります。SeedProdを使用すると、組み込みテーマのいずれかを使用してこれらのテンプレートを簡単に生成できます。
詳細な手順については、コーディングなしでカスタムWordPressテーマを作成する方法に関するチュートリアルをご覧ください。
テーマテンプレートの生成が完了したら、シングル投稿テンプレートの下にある「デザインを編集」リンクをクリックする必要があります。
これにより、SeedProdテーマビルダーインターフェイスに単一投稿のプレビューが読み込まれます。プレビューの下部にあるコメントフォームブロックに気づくでしょう。
コメントフォームをクリックするだけで、左側のパネルにそのプロパティが表示されます。
ここから、コメントノートまたはプライバシーポリシーを追加できます。また、「詳細設定」タブに切り替えて、CSSコードを記述せずにコメントフォームのスタイルを編集することもできます。
完了したら、「保存」ボタンをクリックして変更を公開することを忘れないでください。
SeedProd を使用すると、コードを書かずにウェブサイトのあらゆる要素のスタイルを簡単に変更できます。
ただし、これはテーマビルダーであり、すでに気に入っているWordPressテーマを使用している可能性があります。その場合は、次のヒントがWordPressでコメントフォームのスタイルを手動で変更するのに役立ちます。
WordPressでコメントフォームのスタイルを変更する
ほとんどのWordPressテーマには、comments.phpというテンプレートがあります。このファイルは、ブログ投稿にコメントとコメントフォームを表示するために使用されます。WordPressのコメントフォームは、次の関数を使用して生成されます：<?php comment_form(); ?>。
デフォルトでは、この関数はコメントフォームを3つのテキストフィールド（名前、メール、ウェブサイト）、コメントテキスト用のテキストエリアフィールド、GDPRコンプライアンス用のチェックボックス、および送信ボタンで生成します。
WordPressが各コメントフォームに追加するデフォルトのCSSクラスを調整するだけで、これらの各フィールドを簡単に変更できます。以下は、WordPressが各コメントフォームに追加するデフォルトのCSSクラスのリストです。
#respond { }
#reply-title { }
#cancel-comment-reply-link { }
#commentform { }
#author { }
#email { }
#url { }
#comment
#submit
.comment-notes { }
.required { }
.comment-form-author { }
.comment-form-email { }
.comment-form-url { }
.comment-form-comment { }
.comment-form-cookies-consent { }
.form-allowed-tags { }
.form-submit
これらのCSSクラスを少し変更するだけで、WordPressのコメントフォームの外観を完全に変えることができます。
いくつかの点を変更して、これがどのように機能するかをよく理解できるようにしましょう。
まず、アクティブなフォームフィールドをハイライトすることから始めます。現在アクティブなフィールドをハイライトすると、特別なニーズを持つ人々にとってフォームがよりアクセスしやすくなり、小さなデバイスでもコメントフォームが見栄えが良くなります。
#respond {
background: #fbfbfb;
padding:0 10px 0 10px;
}
/* Highlight active form field */
#respond input[type=text], textarea {
-webkit-transition: all 0.30s ease-in-out;
-moz-transition: all 0.30s ease-in-out;
-ms-transition: all 0.30s ease-in-out;
-o-transition: all 0.30s ease-in-out;
outline: none;
padding: 3px 0px 3px 3px;
margin: 5px 1px 3px 0px;
border: 1px solid #DDDDDD;
}
#respond input[type=text]:focus,
input[type=email]:focus,
input[type=url]:focus,
textarea:focus {
box-shadow: 0 0 5px rgba(81, 203, 238, 1);
margin: 5px 1px 3px 0px;
border: 2px solid rgba(81, 203, 238, 1);
}
こちらが、変更後のWordPress Twenty Sixteenテーマでのフォームの外観です。
これらのクラスを使用すると、入力ボックス内のテキストの表示方法を変更できます。ここでは、著者名と URL フィールドのテキストスタイルを変更します。
#author, #email {
font-family: "Open Sans", "Droid Sans", Arial;
font-style:italic;
color:#1d1d1d;
letter-spacing:.1em;
}
#url {
color: #1d1d1d;
font-family: "Luicida Console", "Courier New", "Courier", monospace;
}
下のスクリーンショットをよく見ると、名前とメールアドレスのフィールドのフォントがウェブサイトのURLと異なっていることがわかります。
WordPressコメントフォームの送信ボタンのスタイルを変更することもできます。デフォルトの送信ボタンを使用する代わりに、CSS3グラデーションとボックスシャドウを適用しましょう。
#submit {
background:-moz-linear-gradient(top, #44c767 5%, #5cbf2a 100%);
background:-webkit-linear-gradient(top, #44c767 5%, #5cbf2a 100%);
background:-o-linear-gradient(top, #44c767 5%, #5cbf2a 100%);
background:-ms-linear-gradient(top, #44c767 5%, #5cbf2a 100%);
background:linear-gradient(to bottom, #44c767 5%, #5cbf2a 100%);
background-color:#44c767;
-moz-border-radius:28px;
-webkit-border-radius:28px;
border-radius:28px;
border:1px solid #18ab29;
display:inline-block;
cursor:pointer;
color:#ffffff;
font-family:Arial;
font-size:17px;
padding:16px 31px;
text-decoration:none;
text-shadow:0px 1px 0px #2f6627;
}
#submit:hover {
background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #5cbf2a), color-stop(1, #44c767));
background:-moz-linear-gradient(top, #5cbf2a 5%, #44c767 100%);
background:-webkit-linear-gradient(top, #5cbf2a 5%, #44c767 100%);
background:-o-linear-gradient(top, #5cbf2a 5%, #44c767 100%);
background:-ms-linear-gradient(top, #5cbf2a 5%, #44c767 100%);
background:linear-gradient(to bottom, #5cbf2a 5%, #44c767 100%);
background-color:#5cbf2a;
}
#submit:active {
position:relative;
top:1px;
}
WordPressコメントフォームを次のレベルへ
基本的すぎるとお思いかもしれませんが、全員が理解できるように、そこから始める必要があります。
ただし、フォームフィールドの並べ替え、ソーシャルログインの追加、コメント購読、コメントガイドライン、クイックタグなどを追加することで、WordPressのコメントフォームを次のレベルに引き上げることができます。
WordPressのコメントにソーシャルログインを追加する
WordPress コメントにソーシャルログインを追加することから始めましょう。
まず、Super Socializer プラグインをインストールして有効化する必要があります。詳細については、WordPress プラグインのインストール方法に関するステップバイステップガイドを参照してください。
有効化したら、Super Socializer » Social Loginにアクセスし、「ソーシャルログインを有効にする」というチェックボックスにチェックを入れる必要があります。
これにより、ソーシャルログインオプションパネルが表示されます。まず、「Advanced Configuration」タブをクリックします。
次に、「コメントフォームで有効にする」ボックスがチェックされていることを確認してください。
次に、「基本設定」タブをクリックします。「ソーシャルネットワークを選択」セクションのチェックボックスをオンにすることで、追加したいソーシャルネットワークを選択できます。
この下に、ソーシャルプラットフォームと接続するためにプラグインにAPIキーが必要になります。各プラットフォームの取得方法の説明を表示するには、「疑問符」アイコンをクリックするだけです。
完了したら、「変更を保存」ボタンをクリックして、ソーシャルログイン設定を保存します。
これで、ウェブサイトにアクセスして、コメントフォームの上にソーシャルログインボタンが表示されることを確認できます。
コメントフォームの前または後にコメントポリシーテキストを追加する
私たちはすべてのユーザーを愛しており、当サイトにコメントを残すために数分を費やしてくださることに心から感謝しています。しかし、健全な議論環境を構築するためには、コメントを管理することが重要です。
完全な透明性を確保するために、コメントポリシーページを作成しましたが、このリンクをフッターに置くだけではいけません。
コメントを残すすべてのユーザーにコメントポリシーをわかりやすく表示したかったのです。そのため、WordPressのコメントフォームにコメントポリシーを追加することにしました。
コメントポリシーページを追加したい場合、まず最初に行うべきことは、WordPressのページを作成し、コメントポリシーを定義することです（私たちのものを盗んで、ニーズに合わせて変更できます）。
その後、以下のコードをテーマのfunctions.phpファイルまたはコードスニペットプラグインに追加できます。
function wpbeginner_comment_text_before($arg) {
$arg['comment_notes_before'] .= '<p class="comment-policy"">We are glad you have chosen to leave a comment. Please keep in mind that comments are moderated according to our <a href="http://www.example.com/comment-policy-page/">comment policy</a>.</p>';
return $arg;
}
add_filter('comment_form_defaults', 'wpbeginner_comment_text_before');
上記のコードは、メモの前にデフォルトのコメントフォームをこのテキストに置き換えます。また、CSS で通知をハイライトできるように、コードに CSS クラスを追加しました。以下は、使用したサンプル CSS です。
p.comment-policy {
border: 1px solid #ffd499;
background-color: #fff4e5;
border-radius: 5px;
padding: 10px;
margin: 10px 0px 10px 0px;
font-size: small;
font-style: italic;
}
テストサイトではこのように表示されました：
コメントテキストエリアの後にリンクを表示したい場合は、次のコードを使用してください。
function wpbeginner_comment_text_after($arg) {
$arg['comment_notes_after'] .= '<p class="comment-policy"">We are glad you have chosen to leave a comment. Please keep in mind that comments are moderated according to our <a href="http://www.example.com/comment-policy-page/">comment policy</a>.</p>';
return $arg;
}
add_filter('comment_form_defaults', 'wpbeginner_comment_text_after');
URLを適切に変更して、example.comではなくコメントポリシーページにアクセスするように忘れないでください。
コメント入力欄を下に移動
デフォルトでは、WordPressのコメントフォームは、コメントテキストエリアが最初に表示され、次に名前、メール、ウェブサイトのフィールドが表示されます。この変更はWordPress 4.4で導入されました。
それ以前は、WordPressのウェブサイトでは、まず名前、メール、ウェブサイトのフィールドが表示され、その後にコメント本文の入力欄が表示されていました。ユーザーは通常その順序でコメントフォームを見慣れていると感じたため、WPBeginnerでは古いフィールド順を使用しています。
それを行いたい場合は、次のコードをテーマのfunctions.phpファイルまたはコードスニペットプラグインに追加するだけです。
function wpb_move_comment_field_to_bottom( $fields ) {
$comment_field = $fields['comment'];
unset( $fields['comment'] );
$fields['comment'] = $comment_field;
return $fields;
}
add_filter( 'comment_form_fields', 'wpb_move_comment_field_to_bottom');
WordPressにコードを追加する場合は、WPCodeのようなコードスニペットプラグインを使用することを常にお勧めします。これにより、functions.phpファイルを編集せずにカスタムコードを簡単に追加できるため、サイトが壊れる心配がありません。
開始するには、無料のWPCodeプラグインをインストールして有効化する必要があります。手順については、WordPressプラグインのインストール方法に関するこの記事を参照してください。
有効化したら、WordPressダッシュボードからCode Snippets » + Add Snippetに移動します。
そこから、「カスタムコードを追加（新規スニペット）」オプションを見つけ、その下にある「+カスタムスニペットを追加」ボタンをクリックします。
その後、画面に表示されるオプションのリストから、コードの種類として「PHPスニペット」を選択する必要があります。
次に、ページの上部にあるスニペットのタイトルを追加します。これは、コードが何のためのものかを覚えておくのに役立つものであれば何でも構いません。
次に、上記のコードを「コードプレビュー」ボックスに貼り付けます。
最後に、スイッチを「非アクティブ」から「アクティブ」に切り替え、「スニペットを保存」ボタンをクリックするだけです。
このコードは、コメントのテキストエリアフィールドを単純に一番下に移動させます。
WordPressコメントフォームからウェブサイト（URL）フィールドを削除する
コメントフォームのウェブサイトフィールドは、多くのスパマーを引き付けます。これを削除してもスパマーを止めたり、スパムコメントを減らしたりすることはできませんが、不適切な著者ウェブサイトリンクを含むコメントを誤って承認してしまうことを確実に避けることができます。
コメントフォームからフィールドが1つ減り、より簡単で使いやすくなります。このトピックの詳細については、WordPressのコメントフォームからウェブサイトのURLフィールドを削除する方法に関する記事をご覧ください。WordPressのコメントフォームからウェブサイトURLフィールドを削除する方法。
コメントフォームからURLフィールドを削除するには、以下のコードをfunctions.phpファイルまたはコードスニペットプラグインに追加するだけです。
function wpbeginner_remove_comment_url($arg) {
$arg['url'] = '';
return $arg;
}
add_filter('comment_form_default_fields', 'wpbeginner_remove_comment_url');
前のセクションと同じ手順に従って、WPCodeプラグインを使用して、このコードをWordPressに安全に追加できます。
WordPressでコメント購読チェックボックスを追加する
ユーザーがあなたのウェブサイトにコメントを残したとき、そのスレッドをフォローして誰かが自分のコメントに返信したかどうかを確認したい場合があります。「コメント購読」チェックボックスを追加することで、投稿に新しいコメントが表示されるたびにユーザーが即座に通知を受け取れるようになります。
このチェックボックスを追加するには、まずSubscribe to Comments Reloadedプラグインをインストールして有効化する必要があります。有効化したら、StCR » Comment Form ページにアクセスしてプラグインの設定を構成してください。
詳細な手順については、WordPressでユーザーがコメントを購読できるようにする方法に関する記事をご覧ください。
WordPressコメントフォームにカスタムフィールドを追加する
WordPressのコメントフォームに追加フィールドを設けたいですか？例えば、ユーザーがTwitterハンドルを追加できるオプションフィールドなどです。
WordPress Comments Fields プラグインをインストールして有効化するだけです。有効化したら、「Comments Fields」ページに移動し、「Comment Fields」タブに切り替えます。
カスタムフィールドをドラッグアンドドロップし、タイトル、説明、データ名を付けます。
フィールドの追加が完了したら、「すべての変更を保存」ボタンをクリックすることを忘れないでください。
これで、コメントフォームを表示して、カスタムフィールドが機能していることを確認できます。
カスタムフィールドは、コメントモデレーションおよびコメントコンテンツの下に表示されます。
詳細については、WordPressのコメントフォームにカスタムフィールドを追加する方法に関するチュートリアルをご覧ください。
この記事が、WordPressのコメントフォームをユーザーにとってより楽しくスタイリングする方法を学ぶのに役立ったことを願っています。また、WordPressのブログ投稿でコメントを増やすためのヒントや、WordPress向けの最高のソーシャルメディアプラグインの専門家による選び方もご覧ください。
この記事が気に入ったら、WordPressのビデオチュートリアルについては、YouTubeチャンネルを購読してください。 TwitterやFacebookでもフォローできます。
tom
素晴らしい記事です！どうもありがとうございます
WPBeginnerサポート
You’re welcome
管理者
mobileninja
本当にありがとうございます。非常に役立つ記事です。
WPBeginnerサポート
Glad it could be helpful
管理者
Emma
こんにちは。素晴らしいチュートリアルです。一部のユーザーでクラッシュが発生する（理由は不明）ため、コメントセクションにウェブサイトのURLを追加することをユーザーに控えさせたいと思いました。成功しましたが、それでも「次回コメントするときは、名前、メールアドレス、ウェブサイトを記憶しておく」という通常のメッセージが表示されます。これを修正する方法を知っていますか？
WPBeginnerサポート
テーマのサポートに確認し、クラッシュやメッセージの編集について知らせることをお勧めします。
管理者
WPBeginnerサポート
Glad our guide could help
管理者
ディーパック・バーティ
このような記事を共有していただきありがとうございます。私と私のウェブサイトにとって役立ちます。
WPBeginnerサポート
Glad our article could be helpful
管理者
ルベル・アーメド
こんにちは
素晴らしい記事で、いくつか提案を参考にしましたが、「コメントフォームの前または後にコメントポリシーテキストを追加する」の下に修正が必要なコードエラーが見つかりました。
フィルターを関数内に追加したため、実行されません。関数の外に移動する必要があります。
Rubel
WPBeginnerサポート
Both filters should be outside the function but we will certainly take another look and update if we can see the error
管理者
suvo
あなたのウェブサイトは明らかに気に入っています。投稿、共有してくれてありがとう。私は毎日あなたのブログを読んでいます。真実を言うのはとても面倒ですが、また必ず戻ってきます。これらのトピックについてもっと書いてください。
WPBeginnerサポート
Glad you like our articles
管理者
ARPIT
ここで提供された情報は非常に良いです。素晴らしいチュートリアルです。共有していただきありがとうございます。長い間これを探していました。WordPressに慣れるのに本当に役立っています！
WPBeginnerサポート
Arpit さん、こんにちは。
We are glad you found the tutorial helpful.
管理者
Hồ Ngọc Thanh
WordPressのテーマで #respond { }
#reply-title { }
#cancel-comment-reply-link { }
#commentform { }
#author { }
#email { }
#url { }
#comment
#submit
が見つかりません？
WPBeginnerサポート
テーマによってスタイルが異なる場合があります。それらを見つけるには、次の記事をご覧ください: https://014.leahstevensyj.workers.dev/wp-tutorials/basics-of-inspect-element-with-your-wordpress-site/
# はオブジェクトの ID に使用されます。例えば、ボタンという ID を持つものがあれば、#button となります。
管理者
Chintan
リアルタイムコメントプレビューを追加するにはどうすればよいですか？
Paulina
こんにちは、この非常に役立つ記事をありがとうございます。「送信」ボタンの前にテキストを追加することに興味があります。ここで提供されているコードでは、「wpbeginner」という単語を自分のサイトに関連するものに変更する必要がありますか？
アクラムル・ハサン
パウリナ様、
コメントフォームフィールドで動作するシンプルなフィルターフックを使用すると、送信ボタンの前にテキストやその他のものを追加できます。
ヘナ
すごい!! とても良いです
Woolker Cherenfant
こんにちは！いつものように素晴らしい記事です。しかし、コメントセクションの「says」という単語をどのように変更できるか疑問に思っています。ハイチクレオール語の「di」に翻訳したいのですが。何か助けはありますか？
事前に感謝します。
—ウールカー
Tisha
Is it possible to copy the code to blogger?. Because I want to make Wordpress style comment in my Blogger blog. Thanks for your help.
Mate Hodi
こんにちは！
素晴らしい記事です！「返信を残す」の部分を変更する方法を探していました。変更する方法について何かアイデアはありますか？
Neeraj
これは、コメントセクションの最適化について、私に詳細なガイダンスを与えてくれた役立つガイドです。
Kevin Byrnes
素晴らしい記事です。私もこれらの問題のいくつかに直面することになるでしょう。
JP
こんにちは
あなたのチュートリアルが大好きです！でも、まだ質問があります。コメントフォーム全体の灰色がかった背景色を他のものに変更することは一般的ですか？もしかしたら、単色ではなく画像にすることもできますか？
Mahesh
あなたのチュートリアル、大好きです。とても理解しやすく、どこでもより役立ちます。
シェアしていただきありがとうございます。
リサ・マーテン
コメントボックスを、投稿されたコメントリストの下ではなく、その上に入力できるようにすることはできますか？
WPBeginnerサポート
はい、できます。
管理者
SiRetu
完全なチュートリアルはありますか？つまり、コメント.phpファイルを作成することから始めて、最初からやり直すということです。いつものように素晴らしいチュートリアルです。ありがとうございます。
Luis Izquierdo
カスタムのwpテーマの子テーマをカスタマイズしており、コメントフォームの上にポリシーテキストを配置することができました。しかし、それはログアウト中のユーザーにしか表示されません。ログイン中のユーザーにも表示させるにはどうすればよいですか？
ルカ・モレッリ
こんにちは、素晴らしいチュートリアルです。ありがとうございます！
あなたのレッスンのおかげで、WordPress に関する知識を向上させ続けています。質問があります（php についてあまり知りません）。コメントポリシーのテキストを送信ボタンの前に追加することに成功しましたが、「返信」をクリックしてあなたのコードを見ると、php の出力が段落タグの中にクラス名「commentpolicy」と一緒に含まれていることに気づきました。どのようにそれを達成しましたか（例：HTML ウェブページ上の php 出力を、CSS でスタイル設定できるタグとクラスでどのようにスタイル設定しますか）？
うまく説明できていて、私の質問が意味をなしていることを願っています。
すべてのチュートリアルに改めて感謝します。
Luca
WPBeginnerサポート
何をお尋ねになりたいのか分かりません。もう少し詳しく説明していただけますか？ありがとうございます。
管理者
Jayanta
私も同じ質問です。少し明確にしようとしています。
コメントフィールドの前にコメントポリシーテキストを取得するためのスニペットを追加しました。しかし、これは単なるテキストであり、そのテキストのために特別なdivクラスは追加されていません。そのため、CSSでスタイルを設定できません（テキストを小さくしたい、またはボーダーボックスを付けたいかもしれません）。ご指導ください。これで意味が通じることを願っています。本当にありがとうございます。
Erick
このウェブサイトのようにコメントを表示するにはどうすればよいですか？
gift charles
これについて本当にありがとうございます。FacebookコメントやDisqusのような他のサービスよりも組み込みコメントの方が好きなので、組み込みコメントをより良く見せる方法を長い間探していました。
Adnan Bashir
お気づきの通り、WPの最新バージョン（4.4）では、テキストボックスの下に名前とメールアドレスのフォームが表示されます。これを以前のスタイル（テキストボックスの上に名前とメールアドレスのボックスがある）に戻す方法について、何かご存知ですか？
ありがとうございます。
WPBeginnerサポート
WordPress 4.4でコメントテキストフィールドを一番下に移動する方法をご覧ください。WordPress 4.4でコメントテキストフィールドを一番下に移動する方法
管理者
Adnan Bashir
Thank you, now the Comment form is looking better
マリオ
こんにちは、素晴らしいチュートリアルです！
しかし、もう一つ質問があります。プライバシーポリシーのチェックボックスを追加することは可能ですか？WordPressシステムはIPアドレスを収集するため、ユーザーにはメッセージを送信する前にチェックボックスにチェックを入れてもらいたいのです。何か提案はありますか？ありがとうございます！
WPBeginnerサポート
WordPressでコメントフォームにカスタムフィールドを追加する方法については、こちらの記事をご覧ください。WordPressでコメントフォームにカスタムフィールドを追加する方法。
管理者
Ramon
顧客がページを最後までスクロールしなくてもコメントを残せるように、入力コメントフィールドをコメント自体の上に配置したいと思います。
これを達成する簡単な方法はありますか？
ありがとうございます。
ドラゴン
コメンターのために編集ボタンを追加する方法はありますか？タイポなどを修正できるように。また、サイトがコメンターにコメントに画像をアップロードする機能を提供したい場合はどうなりますか？それは可能ですか？
リック・ヘレウェル
良いチュートリアルです。これを使って、コメントフォームフィールドの $args を再定義した独自のカスタムコンタクトフォームプラグインを開発しました。
しかし、テスト中に、一部のテーマが独自の
「textarea」フィールドを作成し、それが私の「textarea」フィールドに追加されて、コメント用のテキストフィールドが2つになってしまうことが判明しました。良くないですね。
add_filter( ‘comment_form_default_fields’…. をより高い優先度 (99) に設定しましたが、これは「ページ構築」の後半 (テーマが comment_form_default_fields を実行した後) で発生するためです。しかし、重複したコメントテキストボックスはまだ残っています。優先度 8 も試しましたが、うまくいきませんでした。
ですので、コメントフィールドが既に定義されているかどうかを判断できる（どのテーマでも機能する）汎用的なものを考えられますか？そして、重複が見つかった場合、テーマ内のものを削除して、私のものと置き換えることはできますか？
問題はテーマのコーディング方法が悪いことが原因であると理解していますが、回避策を見つけたいと思っています。
ありがとう…リック…
ラリサ・フロロワ
ありがとうございます！
フォーラムやGoogleで検索しましたが、まだ何をすべきか少し混乱しています。投稿に表示されるコメント/返信リンクの場所だけを変更したい場合、どうすればよいですか？非表示にしたいわけでも、言葉を変えたいわけでもありません。投稿の上部ではなく、下部に表示したいだけです。
Twenty-Twelveテーマでは、どのようにすればそれができますか？
Mikael
このレイアウトは気に入りました！
lflier
とても参考になりました！
現在使用しているDisqusコメントシステムは本当に気に入っています。洗練されていてとても魅力的です。Disqusを使用しているサイトでコメントを残すことが多くなりました。
しかし、BuddyPressアクティビティストリームとの統合が不足しているため、自分のサイトで使用することには消極的です。そのため、ネイティブのWordPressコメントシステムをできるだけDisqusのように魅力的にするために、できる限りのことをしたいと思っています。チュートリアルをありがとうございました。
Therese
本当にありがとうございます！WordPressにますます慣れるのに役立っています！
ソーシャルメディアのログインは完了し、境界線も整理しましたが、コメントボックスの個々のボックスのフォントを編集する場所を見つけるのに完全に詰まっています。
I can’t figure it out.
Can you please tell me where exactly to find that? You don’t specify this clearly enough in the tutorial.
WPBeginnerサポート
記事の#authorおよび#url入力フィールドのフォントを変更した方法をご覧ください。コメントボックスのフォントを変更するには、次のようなものを使用できます。
#comment { font-family: arial, verdana, sans-serif; font-size: 16px; }1-click Use in WordPress
管理者
JG
フォームが送信される前に、ユーザーがチェックを入れなければならない必須チェックボックスを追加するにはどうすればよいですか？ add_filter(‘comment_form_default_fields,) を使用してフィールドを追加しようとしましたが、フィールドは表示されるものの、ボックスにチェックを入れなくてもフォームは送信できてしまいます。
ジュエル
本当にありがとうございます…
Bhushan
試しています
Ann
チュートリアルを読みました…そして、Genesis FrameworkとChildテーマを使用しているWordPressサイトに適用できるかどうか疑問に思っています。ちなみに、Epic Childテーマを使用しています。ご協力ありがとうございます。
WPBeginnerサポート
はい、チュートリアルのいくつかの部分は子テーマに直接適用できます。CSSスタイリングについては、子テーマのCSSをオーバーライドする必要があります。
管理者
Jonathan
コメント購読などのプラグインのチェックボックスを、送信ボタンの上に表示するにはどうすればよいですか？WordPressが通常それらの項目を含める場所を定義する方法はありますか？
WPBeginnerサポート
コメント購読プラグインを使用している場合は、購読チェックボックスを表示したいテンプレートに
<?php show_subscription_checkbox(); ?>を配置できます。管理者
ジェフ・ヒルロン
丸いアバターを取得する方法を調べています。
編集スタッフ
こちらがチュートリアルです：
https://014.leahstevensyj.workers.dev/wp-themes/how-to-display-round-gravatar-images-in-wordpress/
管理者
Ravinder
素晴らしいチュートリアルです。ここに提供された情報は非常に良いです。しばらく探していました。共有していただきありがとうございます。
mohib
これは素晴らしいチュートリアルです。「返信をキャンセルするにはここをクリック」という名前を変更したいのですが、方法が見つかりません。手伝っていただけますか？
マイク・リー
こんにちは、あなたのチュートリアルはとても素晴らしいです。コメントの「返信」という単語をクリックしたときに、そのコメントの下にコメントフォームが表示されるようにするにはどうすればよいですか？
ありがとう
編集スタッフ
これは、スレッドコメントを許可するとWordPressテーマでデフォルトで発生します。WordPressはcomment-reply.min.jsをロードします。テーマがそれをロードしていない場合は、ロードする必要があります。
管理者
ジェイ
私のWordPressではElegant Tonightテーマを使用しており、ダッシュボードの設定 > ディスカッションで「スレッド（ネスト）コメントを3レベルまで有効にする」に設定しています。そのため、スレッドコメントが表示されるはずですが、表示されません。WordPressが comment-reply.min.js を読み込んでいないようです。私の comments.php テーマのどこに追加すればよいですか？そして、そのまま追加すればよいですか、それとも別のコーディング形式ですか？アドバイスがあればお願いします！
編集スタッフ
こんにちは、Jaeさん、
その質問にはElegant Themesのスタッフの方が詳しく答えられると思います。私たちはそのテーマにあまり詳しくありません。Elegant Themesを購入すると、サポートにもアクセスできます。
Robo Ek
いつもながら役立つ記事です。名前を変えた方がいいかもしれません。プロでもあなたのチュートリアルは役立つでしょう
Adrian Robertson
皆さんからのまた素晴らしいチュートリアルです。何かやり方を思い出せないときは、いつも皆さんのサイトにたどり着きます。
素晴らしい仕事です！
Mattia
Hi guys thanks a lot. Just a question: which is the difference between and . With this last one, your adivecs don’t work!
Mattia
sorry the output deleted my question: difference between “comment_form” and “comment_template”…
編集スタッフ
問題ありません。comments_template は、コメントを表示するために使用されるテンプレートを読み込む関数です。デフォルトでは comments.php ファイルを読み込みますが、カスタマイズ版がある場合は別のファイルを使用することもできます。comments.php ファイルには通常、すべてのコメントを読み込むコードが含まれており、comment_form 関数も含まれています。comment_form 関数は、実際のコメントフォーム（名前、メールアドレス、ウェブサイト、メッセージ、送信ボタンなど）を出力します。
Hope that helped clear things up
管理者
Mattia
It did. Thanks
Sue Kearney
このような貴重な情報、とても気に入っています。あなたのやり方をいくつか参考にさせてもらいました。もう半分くらい終わりました。こちらで確認できます：http://goo.gl/8r9uO
再度ありがとうございます！
アーニス・ギルバート
こんにちは、あなたのサイトのように、WordPressサイトのコメントボックスに返信ボタンを追加するにはどうすればよいですか？プラグインですか、それともコードの調整ですか？
ありがとう。
編集スタッフ
こんにちは、Ernice さん、
プラグインではありません。この記事で示されているのと同じテクニックを使用しています。背景色の代わりに、CSSの背景画像プロパティを使用しています。
管理者
Rifat Bin Sharif
WordPressのテーマで、コメント欄に「says」という単語があることに気づいたのですが、comments.phpファイルで見つかりませんでした。このテキストを削除するにはどうすればよいですか？
ありがとうございます
コリン・クロフォード
こんにちは、良い記事です。いくつか提案を使わせていただきましたが、「コメントフォームの前または後にコメントポリシーテキストを追加する」の下に修正が必要なコードエラーを見つけました。
フィルターを関数内に追加したため、実行されません。関数の外に移動する必要があります。
Colin
編集スタッフ
Fixed it
管理者
Gaelyn
すべて素晴らしい提案です。さて、「responses」という単語を「comment」に変更し、より目立たせるにはどうすればよいですか？Suffusionテーマで。ありがとうございます。
編集スタッフ
変更するには、テーマのcomment.phpファイルを編集してください。
管理者
Umer Rock
コメントボックスのすぐ上に画像を挿入したいのですが、どうすればよいですか？例えば、コメントボックスのスクリーンショットはこちらです：http://oi48.tinypic.com/2itrket.jpg
編集スタッフ
記事で示されているフィルターとCSSを使用して、そのように見せることができるでしょう。
管理者
Umer Rock
わかりました。ありがとうございます。記事についてもう一度考えさせてください。私はCSSの専門家ではありません。