WordPressのコメントフォームを必須にする(wp-comments-post.phpへのリダイレクト阻止)

WordPress コメントウェブ
この記事は約4分で読めます。

WordPressのコメントフォームは、デフォルトだと少し厄介です。

inputの無い空フォームでも送信ボタンをクリックすることが可能で、ボタンが押されたあとはwp-comments-post.phpへリダイレクトされています。

そう、こんなやつです↓

まぁデフォルトでも良いのですが、ぶっちゃけダサいのでバリデーションさせたい(検証したい)ですよね?

JQuery validateを使うことで、「このフィールドは必須です」と空フォームを送信不可にできます。

以下のコードを、functions.phpへ記入してください。

なお、テーマのアップデートが行われたときにも変更されないように、子テーマを活用するのがベターです。

//Comment Validation
function comment_validation_init() {
  if(is_single() && comments_open() ) { ?>        
    <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery-validate/1.19.0/jquery.validate.min.js"></script>
    <script type="text/javascript">
     jQuery(document).ready(function($) {
        $('#commentform').validate({
            rules: {
                author: {
                    required: true,
                    minlength: 2
                },

                email: {
                    required: true,
                    email: true
                },

                comment: {
                    required: true,
                    minlength: 20
                }
            },

            messages: {
                author: "名前を入力してください",
                email: "メールアドレスを入力してください.",
                comment: "このフィールドは必須です"
            },

            errorElement: "div",
            errorPlacement: function(error, element) {
                element.after(error);
            }

        });
    });    
    </script>
    <?php
    }
}
add_action('wp_footer', 'comment_validation_init');

あ、子テーマの解説記事書いてませんでしたね。

後で書いておきます(あまり期待しないでください)。

messagesの部分の文章を変えることで個性も演出できます。

絵文字なんか使うと良いかもしれませんね!

            messages: {
                author: "名前を入力してください💪",
                email: "メールアドレスを入力してください📇",
                comment: "このフィールドは必須です📝"
            },

参照:learnersbucket

ウェブ

↓↓↓移動中やスキマ時間にインプットできるAudibleはオススメです✌️

この続きはcodocで購読
Keisuke Kuribara

株式会社Propagation代表取締役。興味対象は、ビットコイン、大麻、ウェブ、金融、生物、心理など。金融から健康、テック、音楽など様々な事について執筆しており、このブログは月間20万PV程度となっております。自身のアウトプットや知的好奇心を満たすことが主な目的です。お仕事の依頼や相談などお気軽にお問い合わせください。Google アナリティクス個人認定資格(GAIQ)を保有。

Keisuke Kuribaraをフォローする

クリブログ