WordPressでメールフォームを作成する際の定番プラグイン「Contact Form 7」

当サイトの問い合わせページも同プラグインで作られており、インストールしてWordPress管理画面から簡単な設定をおこなうだけで、問い合わせフォームを実装することができる便利なプラグインだ。

先日、Contact Form 7のバージョンが古くなっていたので、管理画面からバージョンアップをしたところ、ある問題に遭遇した。

元々迷惑メール対策として、Contact Form 7にreCAPTCHA v3を導入しており、デフォルトだと全ページにreCAPTCHAのバッジがページ右下に表示されてしまうのを、下記の記事で紹介した方法により問い合わせページのみにバッジを表示するよう制御していた。

ところが、プラグインをバージョンアップしたところ、バッジ表示の制御が無効化されてしまい、全ページにバッジが表示されるようになってしまったのだ。

解決にいたったコード

まず、元々functions.phpに書いていたバッジの表示制御コードは以下のとおり。
※3行目is_page('contact')のところはサイトによって適宜変更の必要あり。

// reCAPTCHA v3 バッジを問い合わせページ以外から消す
add_action( 'wp_enqueue_scripts', function() {
  if(is_page('contact')) return;
  wp_deregister_script( 'google-recaptcha' );
});

上記のコードを以下に変更する。

// reCAPTCHA v3 バッジを問い合わせページ以外から消す
function loadRecaptchaJs() {
  if (!is_page('contact') ) {
    wp_dequeue_style('contact-form-7');
    wp_deregister_script('contact-form-7');
    wp_deregister_script('google-recaptcha');
  }
}
add_action( 'wp_enqueue_scripts', 'loadRecaptchaJs', 100);

add_actionの第三引数に指定した100がポイントで、この値は処理の優先度を意味する。
※値は数字が小さければ何でも良いのだが、今回は分かりやすく100とした。

今回の問題はadd_actionの処理が走る順番が原因で、プラグインのバージョンアップにより、元のコードで書いていたadd_actionが実行される前にreCAPTCHAのJSファイルが読み込まれるようになってしまったのだ。

add_actionに優先度を明示化して与え、無理やり先にloadRecaptchaJsを実行するように変更することで、バッジが全ページに表示される問題を解決することができた。