Contact Form 7（CF7）では、reCAPTCHA をご利用の方へに対してTurnstile の利用を推奨しています。
reCAPTCHA をご利用の方へ: Google はすべての reCAPTCHA ユーザーを reCAPTCHA Enterprise に移行させる計画を進めています。これは無料枠を超過した API 呼び出しについて Google から課金されるということです。Contact Form 7 は Cloudflare Turnstile をサポートしており、reCAPTCHA を選択しなければならない理由がある場合を除いて Turnstile の利用を推奨しています。
Contact Form 7でTurnstileを使うメリット
CF7はCloudflare Turnstileを公式サポートしており、追加プラグインなしで導入できます。 そして、画像選択のない軽量な認証方式のため、フォーム送信の失敗やストレスを減らせます。
CF7でTurnstileを設定する手順
では、実際に手順を見ていきましょう。まず、プラグイン「Contact Form 7」インストールして有効化しましょう。
インテグレーションを開く
まず、WordPress管理画面の「お問い合わせ → インテグレーション」を開きます。 Turnstileの項目にある 「インテグレーションのセットアップ」 をクリックします。
Cloudflareで取得したキーを入力する
次に、Cloudflareで発行したサイトキーとシークレットキーを入力します。 そして、保存するとCF7全体でTurnstileが有効化されます。
フォームにTurnstileを追加する方法
デフォルトでは Turnstile ウィジェットはフォームの先頭に配置されます。なので、ショートコードを使用して表示を制御します。
ショートコードを送信ボタン直前に追加
そして、フォーム編集画面で以下を追加します。
[turnstile]サイズ指定の例
フォームのデザインに合わせてサイズ変更も可能です。
[turnstile size:flexible]
[turnstile size:compact]CF7フォームの使用例（Turnstile入り）
このように非常にシンプルな構成でTurnstileを追加できます。
確認すべきポイント
動作後の確認ポイントをいくつか紹介します。
キャッシュプラグインの除外設定
TurnstileはJavaScriptで動作するため、WP RocketやLiteSpeed Cacheが干渉することがあります。 そのため、Turnstile関連のJSはキャッシュ除外するのが安全です。
次に、テーマの footer.php に以下が無いとTurnstileが読み込まれません。
<?php wp_footer(); ?>テーマ Cocoonでは問題ありません。
reCAPTCHAとの併用は避ける（重要）
CF7公式はTurnstile単独利用を推奨しています。
併用すると二重バリデーション(検証)で送信エラーが増えるため、reCAPTCHAキーは削除するのが無難でしょう。
まとめ
CF7でTurnstileを設定する方法は非常にシンプルで、そしてフォームの安全性を大きく向上できます。 インテグレーションでキーを登録し、ショートコードを追加するだけで導入できるため、初心者でも迷いません。
さらに、キャッシュ除外やreCAPTCHA削除などの最適化を行えば、安定したフォーム運用が可能になります。
コメント