問い合わせページ以外でreCAPTCHAを読み込ませない

どんな記事？

Contact Form 7のインテグレーションでreCAPTCHAを導入しましたが、サイト内すべてのページでreCAPTCHAのアイコンが出てしまいます。これを問い合わせページのみに表示させるための記事。

調査

当初はCSSで非表示にすることも考えましたが、利用規約を見るとこんなことが書いてあります。

You are allowed to hide the badge as long as you include the reCAPTCHA branding visibly in the user flow. Please include the following text:

This site is protected by reCAPTCHA and the Google
<a href=”https://policies.google.com/privacy”>Privacy Policy</a> and
<a href=”https://policies.google.com/terms”>Terms of Service</a> apply.

https://developers.google.com/recaptcha/docs/faq#id-like-to-hide-the-recaptcha-badge.-what-is-allowed

ユーザーフローにreCAPTCHAブランドを視覚的に含める場合に限り、バッジを非表示にすることができます。

なのでreCAPTCHAを読み込んでいるページ右下のアイコンを、使わないページで単にCSSで非表示にするのはNGという解釈をしました。まあ規約とか難しいことを考えなくても、使いたいページ以外でそもそも読み込まないようにすればシンプルでいいですね。

修正

functions.php

// 対象ページのみreCAPTCHAを読み込む
add_action('wp_enqueue_scripts', function(){
  if(is_page('contact')) return;
    wp_deregister_script('google-recaptcha');
}, 100, 0);

これでOKです。

is_page('contact')でreCAPTCHAを出力するページを指定します。パーマリンクを書けばいいですね。最後の行の優先度設定も忘れないでください。100にしないと駄目でした。

この方法であればJSの読み込みも減らすことができます。

まとめ

これで他のページがすっきりしましたね！