GeneratePressテーマコメントセクションレイアウトを変更する

  • Naver ブログを共有する
  • Naver バンドに共有する
  • Facebook 共有する
  • Twitter 共有する
  • 카카오스토리공유하기

GeneratePressテーマのコメントセクションでは、他のテーマと同様の方法でカスタムが可能です。 この記事では、このブログに設置されているワードプレスのテーマであるGeneratePressのコメントセクションを変更する方法について簡単に説明します。

GeneratePressテーマコメントセクションレイアウトを変更する

ワードプレスGeneratePressテーマコメントセクションレイアウトを変更する方法

ワードプレス GeneratePressテーマ コメントフォームをカスタムするいくつかの方法について説明します。

コメント入力フォームからのメールフィールドとウェブサイトのフィールドを削除する

コメント入力時、最小限の情報を入力するようにすると、理論上、訪問者がコメントをする可能性が高くなります。 しかし、実際には大きな影響を及ぼさないようです。 コメントフォームを簡潔に作成したい場合コメントフォームからメールフィールドとウェブサイトのフィールドの削除を考慮してみることができます。

GeneratePressテーマでメールフィールドをなくすためには、まずメールフィールドが必須フィールドに設定されことを解除する必要があります。 設定>ディスカッションで「コメントを書いた人の名前と電子メールを必ず残すし、オプションのチェックをオフにします。

ワードプレスコメントメールフィールドなくす

次に FTPで(Webホスティング)サーバに接続して チャイルドテーマ 内の関数ファイル(functions.php)に次のコードを追加します。

// 이메일 필드와 웹사이트 필드 제거하기
add_action( 'after_setup_theme', 'tu_add_comment_url_filter' );
function tu_add_comment_url_filter() {
    add_filter( 'comment_form_default_fields', 'tu_disable_comment_url', 20 );
}

function tu_disable_comment_url($fields) {
    unset($fields['url']);
    unset($fields['email']);
    return $fields;
}

ちなみに、この方法を使用すると、訪問者が名前を入力しなくてもコメントが登録されています。 これを防止するために、次のコードスニペットをテーマ関数ファイルに追加するようにします。 (次のコードは、GeneratePressテーマでテストをしていなかったが、うまく動作しています。)

// 이름 필드를 필수로 만들기
// To make the Name field a required field
function require_comment_name($fields) {
 
if ($fields['comment_author'] == '')
wp_die('Error: please enter a valid name.');
 
return $fields;
}
add_filter('preprocess_comment', 'require_comment_name');

[名前]ボックスとメール欄にしたラインに表示されるようにする

コメントの名前フィールドと電子メールフィールドがPC画面上にライン上に表示されるようにしたい場合は、次のようなコードスニペットをチャイルドテーマの関数ファイルに追加するようにします。

// GeneratePress 테마에서 이름 필드와 이메일 필드를 같은 라인에 표시되도록 하기
// To make the Name and email box appear on the same line
@media (min-width: 769px) {
    .comment-form #author, 
    .comment-form #email {
        width: 48%;
        float: left;
    }

    .comment-form #email {
        float: right;
    }

    .comment-form #url {
        width: 100%;
    }
}

その後、デスクトップで接続時にこのブログのようにコメントセクションの名前(Name)]フィールドと電子メール(E-mail)フィールドが同じ行に表示されます。

ワードプレスGeneratePressテーマ - 名前とメールフィールドをしたラインに表示する

Name、E-mail、Website Placeholder変更する

ワードプレスのコメントのプレースホルダフレーズを変更する

コメント欄にデフォルトで表示されるName、Email、Websiteプレースホルダテキストを変更したい場合は、次のようなコードスニペットをテーマ関数ファイルに入力することができます。

// 이름, 이메일, 웹사이트 Placeholder 변경하기
// Change the Name, Email and Website placehodlers in GeneratePress
add_filter( 'comment_form_default_fields', 'tu_filter_comment_fields', 20 );
function tu_filter_comment_fields( $fields ) {
    $commenter = wp_get_current_commenter();

    $fields['author'] = '<label for="author" class="screen-reader-text">' . esc_html__( 'Name', 'generatepress' ) . '</label><input placeholder="NEW NAME HERE *" id="author" name="author" type="text" value="' . esc_attr( $commenter['comment_author'] ) . '" size="30" />';

    $fields['email'] = '<label for="email" class="screen-reader-text">' . esc_html__( 'Email', 'generatepress' ) . '</label><input placeholder="NEW EMAIL HERE *" id="email" name="email" type="email" value="' . esc_attr( $commenter['comment_author_email'] ) . '" size="30" />';

    $fields['url'] = '<label for="url" class="screen-reader-text">' . esc_html__( 'Website', 'generatepress' ) . '</label><input placeholder="NEW WEBSITE HERE" id="url" name="url" type="text" value="' . esc_attr( $commenter['comment_author_url'] ) . '" size="30" />';


    return $fields;
}

ウェブサイトの部分はうまく動作するかどうか分かりません。 もしかしたら正常に動作しない場合url部分の代わりに次の行に置き換えると、Webサイトのフィールドが削除されます。

unset( $fields['url'] );

他の方法でテーマファイルを直接編集することも可能ですが、テーマが更新されると修正が消えるので好ましくありません。 /wp-content/themes/generatepress/inc/structure/comments.php ファイルから直接フレーズを変更することができます。

「Post Comment」フレーズを変更する

コメントの内容を入力した後、コメントを提出する際に使用される送信ボタンがGeneratePressテーマでは、「Post Comment」になっています。 このフレーズを変更するには、次のようなコードをテーマ関数ファイルに追加するようにします。

// Change Default Post Comment Text
// 기본 "Post Comment" 텍스트 변경하기
add_filter( 'generate_post_comment', 'mj_generate_post_comment' );
function mj_generate_post_comment() {
    return 'Send Comment &#10230;';
}

Send Comment ... 部分を適切に変更するようにします(例:「コメント登録」)。

おわりに

以上で GeneratePressテーマでコメントセクションを変更するいくつかの例を見てみました。 コメントフォームをより精巧に修正したい場合、テーマフォルダ内の comments.php ファイルを変更することができます。 このファイルを修正するには、まず、チャイルドテーマを作成作業してください。

  1. チャイルドテーマを作成します。
  2. FTPを介して親テーマフォルダの下の comments.php ファイルをPCにダウンロードし、ダウンロードしたファイルを(Webホスティングサーバーの)チャイルドテーマのフォルダにアップロードします。
  3. チャイルドテーマのフォルダの下の comments.php ファイルを必要に応じて変更します。

そしてCSSを使用してコメントセクション内のフィールドやテキストサイズ、色、背景色などを変更することができます。

参考



6のコメント

    • ありがとうございます〜

      私はcomments.phpファイルを少し変更して、使用しています。笑

      雨が続い降りますね。 雨道に注意してください。

      応答
  1. 先日ナムギョジュシンGeneratePressのResentPostコードが正常な動作をしないハヌンゴだもしかしたら、まだ使用中のでしょうか?

    応答
    • こんにちは、dd様。

      動作していないコードが具体的にどのようなコードはありますか?

      応答
      • https://www.thewordcracker.com/intermediate/show-related-posts-in-wordpress/

        当時2017年文とはいえ、その文を参照して作成しようとしたが、失敗しました。

      • この記事に記載され、コードでも可能なことがあります。

        GeneratePressでElementsモジュールを使用して、フックにポスト本文の下に関連する記事のリストを表示することができます。

        https://www.thewordcracker.com/intermediate/generatepress-%ED%85%8C%EB%A7%88-%ED%9B%84%ED%81%AC-%EC%82%AC%EC%9A%A9%ED%95%98%EA%B8%B0/

        コードに直接作成する方法もあるが、GeneratePressテーマで関連記事を表示するプラグインを使用することが簡単です。 次の記事を参照してください。

        https://avada.co.kr/themes/generatepress-%ED%85%8C%EB%A7%88%EC%97%90-%EA%B4%80%EB%A0%A8-%EA%B8%80-%ED%91%9C%EC%8B%9C/