WPBeginner - 初心者向けWordPressチュートリアル

最も必要とされている時に、信頼できるWordPressチュートリアルを。
WordPress入門ガイド
WPBカップ
2500万人以上
当社のプラグインを使用しているウェブサイト
16+
WordPress経験年数
3000+
専門家によるWordPressチュートリアル

WordPress コメントフォームのスタイル設定方法 (究極ガイド)

編集スタッフ | | 読者開示

共有数 295 ChatGPT Perplexity X LinkedIn WhatsApp

よく設計されたコメントフォームは、WordPressサイトにコメントを残す人の数に大きな違いをもたらす可能性があります。

コメントフォームがクリーンでモダンで使いやすい場合、訪問者は会話に参加し、コンテンツと対話する可能性が高くなります。

しかし、デフォルトのWordPressコメントフォームはサイトのデザインと一致しないことが多く、それが不親切に感じられ、コメントを控える原因となる可能性があります。

WPBeginnerでは、ユーザーエンゲージメントを高めるためのさまざまな方法を長年テストしてきましたが、コメントフォームのカスタマイズは、私たちがこれまでに行った最も効果的な変更の1つです。

この記事では、WordPressのコメントフォームを簡単にスタイル設定して、ウェブサイトのエンゲージメントを高める方法をご紹介します。

WordPressコメントフォームのスタイリング

開始する前に

WordPressのテーマは、ウェブサイトの外観を制御します。各WordPressテーマには、テンプレートファイル、関数ファイル、JavaScript、スタイルシートなど、いくつかのファイルが付属しています。

スタイルシートには、WordPressテーマで使用されるすべての要素のCSSルールが含まれています。テーマのスタイルルールをオーバーライドするために、独自のカスタムCSSを追加できます。

これを行ったことがない場合は、初心者向けのWordPressにカスタムCSSを追加する方法に関する記事を参照してください。

CSS以外にも、WordPressコメントフォームのデフォルトの外観を変更するためにいくつかの関数を追加する必要がある場合があります。これを行ったことがない場合は、WordPressでコードをコピーして貼り付ける方法に関する記事を参照してください。

それでは、WordPressのコメントフォームのスタイル設定方法を見ていきましょう。

このガイドは非常に包括的であるため、ナビゲーションを容易にするために目次を作成しました。

SeedProdテーマビルダーを使用したWordPressコメントフォームのスタイリング

この方法では、市場で最高のWordPressページおよびテーマビルダープラグインであるSeedProdが必要です。

コーディング経験のない初心者におすすめです。ただし、この方法の欠点は、既存のWordPressテーマがカスタムテーマに置き換わることです。

まず、SeedProdプラグインをインストールしてアクティブ化する必要があります。詳細については、WordPressプラグインのインストール方法に関するステップバイステップガイドをご覧ください。

📍 注：ダウンロード可能なSeedProdの無料版があります。ただし、テーマビルダー機能にアクセスするには、少なくともPROプランが必要です。

有効化したら、カスタムWordPressテーマ用のテンプレートを作成する必要があります。SeedProdを使用すると、組み込みテーマのいずれかを使用してこれらのテンプレートを簡単に生成できます。

詳細な手順については、コーディングなしでカスタムWordPressテーマを作成する方法に関するチュートリアルを参照してください。

テーマテンプレートの生成が完了したら、シングル投稿テンプレートの下にある「デザインを編集」リンクをクリックする必要があります。

シングル投稿テンプレートを編集

これにより、SeedProdテーマビルダーインターフェイスに単一投稿のプレビューが読み込まれます。プレビューの下部にあるコメントフォームブロックに気づくでしょう。

SeedProd でコメントフォームを編集する

コメントフォームをクリックするだけで、左側のパネルにそのプロパティが表示されます。

ここから、コメントノートまたはプライバシーポリシーを追加できます。また、「高度」タブに切り替えて、CSSコードを書かずにコメントフォームのスタイルを編集することもできます。

SeedProdでのコメントフォームの詳細なスタイリングオプション

完了したら、「保存」ボタンをクリックして変更を公開することを忘れないでください。

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
WPCodeによって愛情を込めてホストされています
WordPressで1クリックで使用

これらの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);
}
WPCodeによって愛情を込めてホストされています
WordPressで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;
}
WPCodeによって愛情を込めてホストされています
WordPressで1クリックで使用

下のスクリーンショットをよく見ると、名前とメールアドレスのフィールドのフォントがウェブサイトのURLと異なっていることがわかります。

WordPressコメントフォームの入力スタイル

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;
}
WPCodeによって愛情を込めてホストされています
WordPressで1クリックで使用
コメントフォーム送信ボタン

WordPressコメントフォームを次のレベルへ

基本的すぎるとお思いかもしれませんが、全員が理解できるように、そこから始める必要があります。

ただし、フォームフィールドの並べ替え、ソーシャルログインの追加、コメント購読、コメントガイドライン、クイックタグなどを追加することで、WordPressのコメントフォームを次のレベルに引き上げることができます。

WordPressのコメントにソーシャルログインを追加する

WordPress コメントにソーシャルログインを追加することから始めましょう。

最初に行う必要があるのは、Super Socializerプラグインをインストールしてアクティブ化することです。詳細については、WordPressプラグインのインストール方法に関するステップバイステップガイドを参照してください。

有効化したら、Super Socializer » Social Loginにアクセスし、「ソーシャルログインを有効にする」というチェックボックスにチェックを入れる必要があります。

ソーシャルログインを有効にするにはチェックボックスをオンにする

これにより、ソーシャルログインオプションパネルが表示されます。まず、「Advanced Configuration」タブをクリックします。

次に、「コメントフォームで有効にする」ボックスがチェックされていることを確認してください。

コメントフォームでソーシャルログインを有効にする

次に、「基本設定」タブをクリックします。「ソーシャルネットワークを選択」セクションのチェックボックスをオンにすることで、追加したいソーシャルネットワークを選択できます。

ログイン用のソーシャルネットワークを選択

この下に、ソーシャルプラットフォームと接続するためにプラグインにAPIキーが必要になります。各プラットフォームの取得方法の説明を表示するには、「疑問符」アイコンをクリックするだけです。

ソーシャルネットワーク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');
WPCodeによって愛情を込めてホストされています
WordPressで1クリックで使用

上記のコードは、メモの前にデフォルトのコメントフォームをこのテキストに置き換えます。また、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;
}
WPCodeによって愛情を込めてホストされています
WordPressで1クリックで使用

テストサイトではこのように表示されました：

コメントポリシーに関する注記

コメントテキストエリアの後にリンクを表示したい場合は、次のコードを使用してください。

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');
WPCodeによって愛情を込めてホストされています
WordPressで1クリックで使用

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');
WPCodeによって愛情を込めてホストされています
WordPressで1クリックで使用

WordPressにコードを追加するには、WPCodeのようなコードスニペットプラグインを使用することを常にお勧めします。これにより、functions.phpファイルを編集せずにカスタムコードを簡単に追加できるため、サイトが壊れる心配がありません。

開始するには、無料のWPCodeプラグインをインストールしてアクティブ化する必要があります。手順については、WordPressプラグインのインストール方法に関するこの記事を参照してください。

有効化したら、WordPressダッシュボードからCode Snippets » + Add Snippetに移動します。

そこから、「カスタムコードを追加（新規スニペット）」オプションを見つけ、その下にある「+カスタムスニペットを追加」ボタンをクリックします。

「カスタムコードを追加（新規スニペット）」オプションを選択

その後、画面に表示されるオプションのリストから、コードの種類として「PHPスニペット」を選択する必要があります。

PHP スニペットオプションを選択

次に、ページの上部にあるスニペットのタイトルを追加します。これは、コードが何のためのものかを覚えておくのに役立つものであれば何でも構いません。

次に、上記のコードを「コードプレビュー」ボックスに貼り付けます。

スニペットのタイトルを追加し、コードをコードプレビューボックスに貼り付けます

最後に、スイッチを「非アクティブ」から「アクティブ」に切り替え、「スニペットを保存」ボタンをクリックするだけです。

WPCodeでスニペットをアクティブ化して保存する

このコードは、コメントのテキストエリアフィールドを単純に一番下に移動させます。

コメントフィールドを一番下に移動

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で1クリックで使用
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でも私たちを見つけることができます。

WPBeginnerで現在人気があります！

開示: 当社のコンテンツは読者によってサポートされています。これは、一部のリンクをクリックすると、手数料が発生する可能性があることを意味します。WPBeginnerがどのように資金調達されているか、なぜそれが重要なのか、そしてどのように私たちをサポートできるかを確認してください。こちらが当社の編集プロセスです。

究極のWordPressツールキット

無料のツールキットにアクセスしましょう - すべてのプロフェッショナルが持つべきWordPress関連の製品とリソースのコレクションです！

今すぐダウンロード

読者とのインタラクション

119 コメント返信する

  1. 追加の提案として、コメントモデレーションの作業負荷をさらに軽減するために、CAPTCHAのような簡単なスパム対策を実装することを検討してください。

    返信する

  2. 現在、コメントフォームには1つのコメントテキストエリアフィールドと1つの投稿コメントボタンがあります。Twenty Twenty-Fourテーマには、名前、メール、ウェブサイトのフィールドが見つかりませんでした。

    返信する

    • サイトにログインしている場合、ログイン中のユーザーの情報が自動的に使用されます。シークレットブラウザでサイトにアクセスした場合、コメント投稿者の名前や情報を削除するカスタマイズが行われていない限り、フィールドが表示されるはずです。

      返信する

      管理者

  3. こんにちは。
    この記事大好きです！とても分かりやすく説明されていました！

    簡単な質問ですが、誰かがコメントに返信したときに、「↩」を自分のSVGアイコンに変更するにはどうすればよいですか？

    返信する

    • テーマによって異なります。すべてのテーマにコメントフォームにその記号があるわけではありません。

      返信する

      管理者

  4. この記事を作成していただきありがとうございます。ウェブサイトの URL を削除するためにコードスニペットを使用しましたが、ここではうまく機能しないことに気づきました。その理由は、2つの投稿でしか機能せず、ウェブサイトの他の投稿のコメントセクションにはまだ URL ボックスが表示されているからです。

    私だけがうまくいっていないのでしょうか？また、コード内の「wpbeginner」を私のドメイン名に置き換える必要がありますか？

    返信する

    • テーマの標準スタイルが上書きされている可能性があるため、テーマに確認することをお勧めします。コードからwpbeginnerを削除する必要はありません。動作します。:)

      返信する

      管理者

  5. Seed Prodを使用したチュートリアルをありがとうございます。現在WP Discuzを使用しており、それに満足しています。しかし、小規模なサイトでは、Seed Prodの方がはるかにエレガントなフォームになります。指示はかなり長いですが、Seed Prodがインストールされているテストサイトで試してみます。素晴らしい、非常に詳細なチュートリアルをありがとうございます。

    返信する

  6. ウェブサイトで様々なコメント欄を見てきましたが、すべて同じWordPressのコメント機能を使用しているのに、なぜ見た目が異なるのか疑問に思っていました。
    見た目の良いコメント欄は、コメントする際のユーザーエクスペリエンスを向上させるために不可欠です。
    私は2年間使用してきたWordPressのコメント機能であるDisqusプラットフォームについて質問があります。
    引き続き使用するのは良い考えでしょうか、それとももっと良い代替手段はありますか？
    また、WPBeginnerがコメント機能に何を使用しているのか、単に知りたいです。

    返信する

    • 私の意見では、WP Discuzは素晴らしいプラグインです。ブログでほぼ2年間使用していますが、これまでのところ問題なく動作しています。ですので、もしあなたも使用しているなら、このプラグインを必ずしも変更する必要はないでしょう。開発者とサポートチームは素晴らしい仕事をしています。ただし、このプラグインはかなり大きく複雑なので、ウェブサイトの種類やサイズにも依存するでしょう。

      返信する

  7. 素晴らしいチュートリアルをありがとうございました。
    一点だけうまくいかなかったことがあります：テキストエリアを一番下に移動させることです。コードスニペットにスクリプトを追加しましたが、何も変わりませんでした。あなたが書いた時から何か変更はありましたか？
    ありがとうございます。
    Vera

    返信する

    • スニペットは引き続き正しく機能するはずです。使用中のテーマがコメントフォームにスタイルを追加し、一部の表示を変更している可能性があります。お使いの特定のテーマのサポートに確認すれば、チェックと確認の助けを得られます。

      返信する

      管理者

  13. WordPressフォームのスタイル設定方法についてご指導いただきありがとうございます。しかし、コメントフォームからURLフィールドを削除する方法について、ほとんどすべてのコードを試しましたが、残念ながらどれも機能しませんでした。別のコードを教えていただけますでしょうか。

    返信する

    • 当社の推奨事項のいずれも役に立たなかった場合は、お使いの特定のテーマのサポートに連絡することをお勧めします。彼らはコメントの特定のターゲットを支援できるはずです。

      返信する

      管理者

  17. こんにちは、チュートリアルは素晴らしいです！しかし、投稿コメントを編集する正しい.phpファイルを見つけるのに問題があります。OceanWPテーマとElementor Proを使用しています。functions.phpまたはcomments.phpに移動しても、コマンドラインが見つかりません。コードを追加してみましたが、何も起こりません。どこか別の場所にあると思いますが、どこですか？

    返信する

    • ページビルダーを使用している場合、コメントフォームの編集方法や利用可能なツールについては、そのページビルダーのサポートに問い合わせる必要があります。

      返信する

      管理者

    • テーマがそのように設定されていない場合は、残念ながらそれを実行するためにテーマのコードを変更する必要があります。各テーマのコードは非常に異なるため、現時点では具体的なガイドはありません。

      返信する

      管理者

  22. こんにちは。素晴らしいチュートリアルです。一部のユーザーでクラッシュが発生する（理由は不明）ため、コメントセクションにウェブサイトのURLを追加することをユーザーに控えさせたいと思いました。成功しましたが、それでも「次回コメントするときは、名前、メールアドレス、ウェブサイトを記憶しておく」という通常のメッセージが表示されます。これを修正する方法を知っていますか？

    返信する

    • テーマのサポートに確認し、クラッシュやメッセージの編集について知らせることをお勧めします。

      返信する

      管理者

  24. このような記事を共有していただきありがとうございます。私と私のウェブサイトにとって役立ちます。

    返信する

  25. こんにちは

    素晴らしい記事で、いくつか提案を参考にしましたが、「コメントフォームの前または後にコメントポリシーテキストを追加する」の下に修正が必要なコードエラーが見つかりました。

    フィルターを関数内に追加したため、実行されません。関数の外に移動する必要があります。

    ルーベル

    返信する

    • 両方のフィルターは関数の外にある必要がありますが、もう一度確認し、エラーが見つかった場合は更新します:)

      返信する

      管理者

  26. あなたのウェブサイトは明らかに気に入っています。投稿、共有してくれてありがとう。私は毎日あなたのブログを読んでいます。真実を言うのはとても面倒ですが、また必ず戻ってきます。これらのトピックについてもっと書いてください。

    返信する

  27. ここで提供された情報は非常に良いです。素晴らしいチュートリアルです。共有していただきありがとうございます。長い間これを探していました。WordPressに慣れるのに本当に役立っています！

    返信する

  28. WordPressのテーマで #respond { }
    #reply-title { }
    #cancel-comment-reply-link { }
    #commentform { }
    #author { }
    #email { }
    #url { }
    #comment
    #submit
    が見つかりません？

    返信する

    • こんにちは、この非常に役立つ記事をありがとうございます。「送信」ボタンの前にテキストを追加することに興味があります。ここで提供されているコードでは、「wpbeginner」という単語を自分のサイトに関連するものに変更する必要がありますか？

      返信する

      • パウリナ様、
        コメントフォームフィールドで動作するシンプルなフィルターフックを使用すると、送信ボタンの前にテキストやその他のものを追加できます。

        返信する

  31. こんにちは！いつものように素晴らしい記事です。しかし、コメントセクションの「says」という単語をどのように変更できるか疑問に思っています。ハイチクレオール語の「di」に翻訳したいのですが。何か助けはありますか？

    事前に感謝します。

    —ウールカー

    返信する

  32. ブロガーにコードをコピーすることは可能ですか？WordPressスタイルのコメントをBloggerブログに表示したいからです。ご協力ありがとうございます。:)

    返信する

  33. こんにちは！

    素晴らしい記事です！「返信を残す」の部分を変更する方法を探していました。変更する方法について何かアイデアはありますか？

    返信する

  36. こんにちは
    あなたのチュートリアルが大好きです！でも、まだ質問があります。コメントフォーム全体の灰色がかった背景色を他のものに変更することは一般的ですか？もしかしたら、単色ではなく画像にすることもできますか？

    返信する

  37. あなたのチュートリアル、大好きです。とても理解しやすく、どこでもより役立ちます。

    シェアしていただきありがとうございます。

    返信する

  38. コメントボックスを、投稿されたコメントリストの下ではなく、その上に入力できるようにすることはできますか？

    返信する

  39. 完全なチュートリアルはありますか？つまり、コメント.phpファイルを作成することから始めて、最初からやり直すということです。いつものように素晴らしいチュートリアルです。ありがとうございます。

    返信する

  40. カスタムのwpテーマの子テーマをカスタマイズしており、コメントフォームの上にポリシーテキストを配置することができました。しかし、それはログアウト中のユーザーにしか表示されません。ログイン中のユーザーにも表示させるにはどうすればよいですか？

    返信する

  41. こんにちは、素晴らしいチュートリアルです。ありがとうございます！

    あなたのレッスンのおかげで、WordPress に関する知識を向上させ続けています。質問があります（php についてあまり知りません）。コメントポリシーのテキストを送信ボタンの前に追加することに成功しましたが、「返信」をクリックしてあなたのコードを見ると、php の出力が段落タグの中にクラス名「commentpolicy」と一緒に含まれていることに気づきました。どのようにそれを達成しましたか（例：HTML ウェブページ上の php 出力を、CSS でスタイル設定できるタグとクラスでどのようにスタイル設定しますか）？

    うまく説明できていて、私の質問が意味をなしていることを願っています。

    すべてのチュートリアルに改めて感謝します。

    Luca

    返信する

      • 私も同じ質問です。少し明確にしようとしています。
        コメントフィールドの前にコメントポリシーテキストを取得するためのスニペットを追加しました。しかし、これは単なるテキストであり、そのテキストのために特別なdivクラスは追加されていません。そのため、CSSでスタイルを設定できません（テキストを小さくしたい、またはボーダーボックスを付けたいかもしれません）。ご指導ください。これで意味が通じることを願っています。本当にありがとうございます。

        返信する

  43. これについて本当にありがとうございます。FacebookコメントやDisqusのような他のサービスよりも組み込みコメントの方が好きなので、組み込みコメントをより良く見せる方法を長い間探していました。

    返信する

  44. お気づきの通り、WPの最新バージョン（4.4）では、テキストボックスの下に名前とメールアドレスのフォームが表示されます。これを以前のスタイル（テキストボックスの上に名前とメールアドレスのボックスがある）に戻す方法について、何かご存知ですか？
    ありがとうございます。

    返信する

  45. こんにちは、素晴らしいチュートリアルです！
    しかし、もう一つ質問があります。プライバシーポリシーのチェックボックスを追加することは可能ですか？WordPressシステムはIPアドレスを収集するため、ユーザーにはメッセージを送信する前にチェックボックスにチェックを入れてもらいたいのです。何か提案はありますか？ありがとうございます！

    返信する

  46. 顧客がページを最後までスクロールしなくてもコメントを残せるように、入力コメントフィールドをコメント自体の上に配置したいと思います。

    これを達成する簡単な方法はありますか？

    ありがとうございます。

    返信する

  47. コメンターのために編集ボタンを追加する方法はありますか？タイポなどを修正できるように。また、サイトがコメンターにコメントに画像をアップロードする機能を提供したい場合はどうなりますか？それは可能ですか？

    返信する

  48. 良いチュートリアルです。これを使って、コメントフォームフィールドの $args を再定義した独自のカスタムコンタクトフォームプラグインを開発しました。

    しかし、テスト中に、一部のテーマが独自の
    「textarea」フィールドを作成し、それが私の「textarea」フィールドに追加されて、コメント用のテキストフィールドが2つになってしまうことが判明しました。良くないですね。

    add_filter( ‘comment_form_default_fields’…. をより高い優先度 (99) に設定しましたが、これは「ページ構築」の後半 (テーマが comment_form_default_fields を実行した後) で発生するためです。しかし、重複したコメントテキストボックスはまだ残っています。優先度 8 も試しましたが、うまくいきませんでした。

    ですので、コメントフィールドが既に定義されているかどうかを判断できる（どのテーマでも機能する）汎用的なものを考えられますか？そして、重複が見つかった場合、テーマ内のものを削除して、私のものと置き換えることはできますか？

    問題はテーマのコーディング方法が悪いことが原因であると理解していますが、回避策を見つけたいと思っています。

    ありがとう…リック…

    返信する

  49. ありがとうございます！

    フォーラムやGoogleで検索しましたが、まだ何をすべきか少し混乱しています。投稿に表示されるコメント/返信リンクの場所だけを変更したい場合、どうすればよいですか？非表示にしたいわけでも、言葉を変えたいわけでもありません。投稿の上部ではなく、下部に表示したいだけです。

    Twenty-Twelveテーマでは、どのようにすればそれができますか？

    返信する

返信する

コメントいただきありがとうございます。すべてのコメントは、コメントポリシーに従ってモデレーションされ、メールアドレスは公開されません。名前フィールドにキーワードを使用しないでください。個人的で意味のある会話をしましょう。

Copyright © 2009 - 2026 WPBeginner LLC. All Rights Reserved. WPBeginner® は登録商標です。

管理元：Awesome Motive | SiteGroundによるWordPressホスティング

WordPress® の商標は WordPress Foundation の知的財産です。このウェブサイトでの WordPress® およびその名称の使用は、識別目的のみであり、WordPress Foundation による承認を意味するものではありません。WPBeginner は WordPress Foundation によって承認、所有、または提携されていません。

私は…について助けが必要です

人気の検索:

ブログの始め方 WordPress SEO WordPressのパフォーマンス WordPressのエラー WordPressセキュリティ オンラインストアの構築