WordPressでCloudflare Turnstile CAPTCHAを追加する方法

私たちのワードプレスサイトでお問い合わせフォームを運営することは、私たちに貴重な教訓を与えてくれました。多くのCAPTCHAオプションを試しましたが、訪問者をイライラさせることがよくありました。

通常のCAPTCHAはスパムを阻止しますが、人々はそれを好みません。特に携帯電話では、パズルが難しいという苦情がありました。プライバシーを心配する声もありました。

そしてCloudflare Turnstileに出会い、すべてが変わりました。訪問者を煩わせることなくスパムをブロックしてくれます。この方法で、フォームに記入してもらいながらスパムを減らすことができます。

このガイドでは、WordPressサイトにTurnstileを追加する方法を紹介します。

なぜWordPressにCloudflare Turnstile CAPTCHAを追加するのか？

スパムやボットは、スパムリンクの送信、ログインフォームへの侵入、リードジェネレータフォームへのスパムメールの殺到など、ウェブサイトに問題を引き起こす可能性があります。

これらはすべて、ブルートフォース攻撃の余地を生み出し、訪問者のエクスペリエンスを台無しにする可能性がある。オンラインストアを運営している場合、自動化されたスクリプトが不正な注文を行う可能性もあります。

多くのウェブサイト所有者は、スクリプトやボットをブロックするためにCAPTCHAやreCAPTCHAを使用しています。しかし、これらのテクノロジーはユーザーエクスペリエンスを低下させると不満を持つ人も多く、CAPTCHAにデータを盗まれるのではないかと心配する人さえいます。

このような懸念を念頭に置いて、CloudflareはTurnstile CAPTCHAを導入しました。この技術は、ブラウザー上で不可視に実行されるシンプルで非侵入的なチャレンジを使用し、訪問者に複雑なパズルを解くよう求めることなくサイトを保護します。

さらに、アップルのプライベート・アクセストークンを使用することで、余分なデータを収集することなくユーザーを確認することができる。

フォームビルダーやWooCommerceを使用している場合、Turnstileはこれらのサードパーティプラグインとも統合します。これにより、WordPressサイトの様々なエリアに不可視のCAPTCHAを追加することができます。

それでは、WordPressにCloudflare Turnstile CAPTCHAを追加する方法を見てみましょう。以下のクイックリンクからお好きな方法にジャンプしてください：

方法 1: WPForms を使ってCloudflare CAPTCHA を 追加する (WordPress フォーム用)

CloudflareのCAPTCHAをフォームに追加する最も簡単な方法は、無料のWPFormsプラグインを使用することです。

WPFormsは600万以上のサイトで使用されているドラッグ＆ドロップ式のWordPressフォーム作成プラグインです。お問い合わせフォーム、予約フォームなど、すべての種類のフォームを作成するために使用することができます。

無料のWPFormsプラグインには、任意のフォームにドラッグ＆ドロップできる既製のCloudflare Turnstileフィールドがあります。

WPFormsにターンスタイルCAPTCHAを追加する方法

まず、WPFormsプラグインをインストールして有効化する必要があります。ヘルプが必要な場合は、WordPressプラグインのインストール方法のガイドを参照してください。

有効化した後、WPForms ” Settingsに行き、CAPTCHAタブをクリックします。

このページで「ターンスタイル」を選択する。

サイトキーとサイトシークレットを入力する新しい設定が表示されます。

この情報を取得するには、新しいブラウザのタブを開き、Cloudflareのログインページに移動します。まだログインしていない場合は、メールアドレスを使用してCloudflareアカウントを作成する必要があります。

ダッシュボードにログインしたら、左側のメニューから「Turnstile」を見つけてクリックします。

Cloudflare Turnstileの基本情報が表示される画面が表示されます。

よろしければ、「サイトを追加」ボタンをクリックしてください。

この画面で、まず「サイト名」を入力する。

これはあくまで参考なので、お好きなものを使ってください。

次に、あなたのサイトのドメイン名を「Domain」フィールドに入力します。

次のステップは、どのCAPTCHAウィジェットを作成するかを選択することである。最初の選択肢は「Managed」で、これはCloudflareが推奨する方法です。これはCloudflareがブラウザーからのリクエストを分析し、どのようなチャレンジを実行すべきかを決定するものです。

この間、訪問者はローディング・アニメーションを見ることになる。

可能な限り、Cloudflareは訪問者が何もする必要がないように、バックグラウンドで非インタラクティブなチャレンジを実行するようにします。この場合、ユーザーはブラウザーがテストに合格すると「Success」メッセージを見るだけです。

時には、Cloudflareが代わりにインタラクティブなチャレンジを表示した方が安全だと判断することもあります。しかし、訪問者はパズルを完成させるのではなく、ボックスをチェックするだけなので、従来のパズルベースのCAPTCHAよりはまだ簡単です。

特別な理由がない限り、管理されたCAPTCHAを使用するのが賢明です。これにより、訪問者のエクスペリエンスへの影響を最小限に抑えながら、十分なレベルのセキュリティを確保できます。

WordPressサイトでインタラクティブチャレンジを使用したくないですか？代わりに「非インタラクティブ」または「不可視」を選択できます。

非インタラクティブチャレンジはブラウザーで実行されるため、訪問者は何もする必要がありません。管理されたCAPTCHAと同様に、訪問者はローディングアニメーションとチャレンジ完了時の「成功」メッセージを見ることができます。

代わりに「不可視」を選択すると、訪問者はアニメーションや成功メッセージを見ることができません。この設定により、訪問者からCAPTCHAを完全に非表示にすることができ、混乱を避けることができ、WordPressテーマが乱雑になることもありません。

決定後、「Create」ボタンをクリックします。そうするとすぐに、Cloudflareがあなたのサイトキーとシークレットキーを表示します。

WordPressでCloudflare Turnstile CAPTCHAを設定する方法

WordPressのブログやサイトに戻り、「サイト・キー」と「サイト・シークレット」を追加する。

初期設定では、WPFormsは訪問者がCAPTCHAに失敗するたびに次のメッセージを表示します: ‘Cloudflare Turnstile verification failed, please try again later’.

Fail Message’フィールドに入力することで、カスタマイザーに置き換えることができます。

その後、’Type’ ドロップダウンを開き、light、dark、autoから選択することで、サイト上でのCAPTCHAの見え方をカスタマイズすることができます。

次の画像は、カスタムユーザー登録フォームで「ダーク」テーマがどのように見えるかの例です。

この決定をした後、画面を一番下までスクロールし、「Save Settings」をクリックする。

これで、任意のフォームにTurnstile CAPTCHA保護を追加する準備が整いました。

WordPressのフォームにCloudflare Turnstile CAPTCHAを追加する方法

WPFormsを使用したWordPressへのCloudflare Turnstileの追加はシンプルで簡単です。

WPFormsを使って新規フォームを作成するには、WPForms ” Add Newにアクセスします。

まず始めに、「フォームの名前フィールド」にフォームの名前を入力します。これは参考のためなので、好きなものを使ってください。

WPFormsには既製のテンプレートが用意されているので、すぐに使い始めることができ、さまざまな種類のフォームを作成することができます。使いたいデザインが見つかったら、オレンジ色の’テンプレートを使う’ボタンをクリックしてください。

テンプレートを選択すると、WPFormsエディターが表示されます。

フィールドをカスタマイズするには、フォームエディターでクリックして選択するだけです。サイドバーが更新され、選択されたフィールドのすべての設定が表示されます。

また、ドラッグ＆ドロップでこれらのフィールドの外観の順序を変更することもできます。

Cloudflare Turnstileをフォームに追加するには、左側のメニューにある「Add Fields」タブをクリックするだけです。

ここで、ビルトイン「Turnstile」フィールドを見つけ、クリックしてフォームに追加します。

WPFormsの右上に’Turnstile Enabled’アイコンが表示されるようになりました。

これにより、フォームがCloudflare Turnstileで保護されていることがわかります。

もう一つのオプションは、フォームの設定でCloudflareを有効化することです。左側のメニューから「設定」を選択し、「スパム保護とセキュリティ」をクリックするだけです。

ここで「Enable Cloudflare Turnstile」スイッチをクリックして、無効化（灰色）から有効化（青色）にします。

フォームの設定に満足したら、「保存」ボタンをクリックしてください。

フォームを表示したいページや投稿日に行き、’+’アイコンをクリックします。ポップアップが表示されたら、’WPForms’ と入力します。

適切なブロックが表示されたら、クリックしてページや投稿に追加する。

新規WPFormsブロックで、ドロップダウンをクリックし、先ほど作成したフォームを選択します。

これでページを更新または公開することができます。これで、このページや投稿にアクセスすると、フォームがライブで表示されます。

詳しくは、WordPress で安全なお問い合わせフォームを作成する方法をステップごとに説明したガイドをご覧ください。

方法2：コメントやWooCommerceなどにTurnstile CAPTCHAを追加する（無料プラグイン）

フォームをCloudflare Turnstileで保護したい場合、WPFormsを使えば数クリックでCAPTCHA保護を追加できます。

しかし、あなたのサイトの他のエリアにTurnstileを追加したい場合があります。例えば、WordPressのコメントスパムに対抗するために使用することができます。

WooCommerceストアでTurnstileを使用することもできます。

例えば、WooCommerceのログイン、サインアップ、購入手続きなどのeコマースページをすべて保護することができます。これにより、WooCommerceでの詐欺や偽の注文を防ぐことができます。

WordPressの他のエリアにCloudflareのCAPTCHAを追加する最も簡単な方法は、Simple Cloudflare Turnstileを使うことです。この無料プラグインはFormidable Forms や WPForms など多くの人気の WordPress プラグインやフォームビルダーと統合できます。

まず、プラグインをインストールして有効化する必要があります。WordPressプラグインのインストール方法については、こちらをご覧ください。

有効化したら、Settings ” Cloudflare Turnstileに進みます。

プラグインはサイトキーとサイトシークレットを要求します。この情報を取得するには、Turnstileアカウントをセットアップするときに上で説明したのと同じ手順に従ってください。

これで、WordPressダッシュボードに「サイトキー」と「サイトシークレット」を追加します。

その後、CAPTCHAがあなたのサイトでどのように見えるか、どのように動作するか、一般設定でカスタマイザーしたいかもしれません。まず、’テーマ’ドロップダウンを開き、ライト、ダーク、オートから選択することができます。

サイト訪問者がさまざまな国から来る場合は、「Language」フィールドで「Auto Detect」を選択できます。こうすると、Cloudflare Turnstileは訪問者が使用している言語を使用します。

外観」モードでは、Turnstileウィジェットをすべてのユーザーに表示するか、特定のインタラクションのみに表示するかを選択できます。最も安全なオプションは’Always’を選択することです。

改札口送信ボタンを無効化することも可能です。このオプションを設定すると、ユーザーが改札チャレンジを完了したときにクリックする送信ボタンはなくなります。

下にスクロールすると、高度な設定があります。

ここでできることの1つは、スクリプトを遅延させることです。この設定は、JavaScriptコードを実行する前にページ全体が読み込まれるまで待つようにブラウザーに指示するため、ウェブページの読み込みを速くすることができます。

ただし、この設定によってサイトの他の部分で問題が発生する場合は、オフにしたほうがよいでしょう。

また、改札メッセージをカスタマイズすることもできます。初期設定では、Cloudflareは訪問者に「あなたが人間であることを確認してください」というメッセージを表示します。独自の文言を追加するには、「カスタムエラーメッセージ」フィールドに入力するだけです。

最後に、[追加の失敗メッセージ]を有効化することができます。この設定では、ユーザーがチャレンジに失敗した場合に改札ウィジェットの下に表示される追加メッセージを追加できます。

高度な設定の下にはホワイトリスト設定があります。

ここでは、ログイン中のユーザーがCloudflare Turnstileを完了しないように設定できます。また、チャレンジを通過する必要のないIPアドレスをリストアップすることもできます。

その後、Cloudflare Turnstile CAPTCHAを使用したいエリアを選択できます。

ログインページ、ユーザー登録フォーム、パスワードリセットページなど、WordPressにビルトインされているすべてのフォームでTurnstileを使用できます。

インストールしたプラグインによっては、追加のオプションが表示される場合があります。

例えば、WooCommerceを使ってオンラインストアを作成した場合、WooCommerce Formsセクションが表示されます。

クリックしてこのセクションを展開すると、Cloudflare CAPTCHAを追加できるすべてのWooCommerceページが表示されます。

保護したいページの横にあるボックスにチェックを入れるだけです。

入力した情報に問題がなければ、画面を一番下までスクロールし、「変更を保存」をクリックします。

今、あなたのサイトにアクセスすると、Turnstile CAPTCHAが動作しているのがわかります。

究極のガイドでウェブサイトをさらに守る

あなたのサイトを不正ユーザーや悪意のあるボットからさらに安全に保ちたいですか？以下の投稿をチェックして、サイトのセキュリティを向上させましょう：

• WordPressへのDDoS攻撃を阻止・防止する方法
• WordPressでログイン試行を制限する方法と理由
• WordPressのフォームをパスワードで保護する方法
• WordPressにGoogleのワンクリックログインを追加する方法
• Let’s EncryptでWordPressに無料SSLを追加する方法
• WordPressに二要素認証を追加する方法（無料版）

この記事が、WordPressにCloudflare Turnstile CAPTCHAを追加する方法を学ぶのにお役に立てば幸いです。また、究極のWordPressセキュリティガイドとエキスパートが選ぶ最高のWordPressセキュリティプラグインもご覧ください。

If you liked this article, then please subscribe to our YouTube Channel for WordPress video tutorials. You can also find us on Twitter and Facebook.