ContactForm7のスパムメール対策 reCAPTCHA設定方法

スポンサーリンク
スポンサーリンク

ContactForm7のスパム対策 reCAPTCHA

問い合わせフォームを簡単に作成できるWordPressプラグイン「ContactForm7」のスパムメール対策として、GoogleのreCAPTCHA設定方法をご紹介します。

ContactForm7は、WordPressでメールフォームを設置できる定番プラグインですが、メールフォームからスパムメールが大量に送られてきて困っている方も多いかと思います。

ContactForm7でスパムメールを防ぐための対策としては、Akismetを使うのが一般的ですが、今回はGoogleのreCAPTCHAを設定してみました。

ContactForm7の設定画面にも「賢いreCAPTCHAはうっとうしいスパムボットをブロックしてくれます。」とあるので、公式に推奨しているようです。

reCAPTCHAにはいくつか種類がありますが、サイト訪問者が手動でチェックを入れる「Check」か、操作不要で目立たない「Invisible」を使えばよいでしょう。Invisibleにはスパムコメントを防止する機能や、ログイン画面保護機能もあります。

CheckはContactForm7上で設定できるのでプラグイン不要ですが、Invisibleはプラグイン「Invisible reCaptcha for WordPress」を使って設定します。

スポンサーリンク

reCAPTHCAアカウント登録

では、ContactForm7にGoogleのreCAPTCHAを設定してみましょう。まずはプラグイン不要で手動チェックを行うタイプの「Check」設定方法を解説します。

ダッシュボードから「お問い合わせ」→「インテグレーション」に進むと、reCAPTCHAを設定することができます。まずはreCAPTCHA用のAPI キーを取得するために、右上のリンクからGoogle「reCAPTCHA」へアクセスします。

reCAPTCHA設定 google.com/recaptcha/

ContactForm7 reCAPTCHA設定

右上の「My reCAPTCHA」をクリックします。

Google My reCAPTCHA

reCAPTCHAを設定するサイトに関連したGoogleアカウントでログインしてください。Googleアカウントがない場合は、「アカウントを作成」で新規作成します。

reCAPTCHA Googleアカウント

GoogleのreCAPTCHA設定ページです。ここに必要項目を入力していきます。

Google reCAPTCHA設定

reCAPTHCA Checkboxの設定

では、CheckboxタイプのreCAPTCHAを設定しましょう。

Label: 設置するサイトの名前等を入力すればOKです。
Choose the type of reCAPTCHA: Checkboxを選択します。
Domains: reCAPTCHAを設置するサイトのドメインを入力します。

あとは「Accept the reCAPTCHA Terms of Service.」と「Send alerts to owners」にチェックを入れて「Register」をクリックします。

Google reCAPTCHA設定

「Site key」と「Secret key」をコピーしてください。この2つのAPIキーを入力すると、ContactForm7でreCAPTHCAが使えるようになります。

Google reCAPTCHA設定

スポンサーリンク

ContactForm7 APIキー入力

もう一度ダッシュボードから「お問い合わせ」→「インテグレーション」に進み、「キーを設定する」をクリックします。

ContactForm7 reCAPTCHA設定

さきほどコピーした「Site key」と「Secret key」を入力して「保存」をクリックします。

ContactForm7 reCAPTCHA設定

「設定を保存しました。」と表示されたらOKです。

ContactForm7 reCAPTCHA設定

ContactForm7 reCAPTHCA設定

これで準備が整ったので、メールフォームにreCAPTHCAを設置してみましょう。「お問い合わせ」→ メールフォーム名をクリックします。

ContactForm7 reCAPTCHA設定

フォームテンプレートの編集から、reCAPTCHAを設置したい場所にカーソルを移動させて、「reCAPTCHA」ボタンをクリックします。

ContactForm7 reCAPTCHA設定

reCAPTCHAのサイズやテーマを選択できます。CSSでデザインを調整する場合は「ID属性」「クラス属性」を入力して「タグを挿入」をクリックします。

または[recaptcha]をコピーして、フォームの好きな場所に貼り付けてもOKです。

ContactForm7 reCAPTCHA設置

フォームに[recaptcha]のタグが挿入されました。「保存」をクリックします。

ContactForm7 reCAPTCHA設置

スポンサーリンク

メールフォームのreCAPTCHA動作

フォームを設置したページを見ると、ちゃんとreCAPTCHAが追加されてますね。

ContactForm7 reCAPTCHA設置

reCAPTCHAにチェックを入れないと「あなたがロボットではないことを証明してください。」と表示されてメールの送信ができません。

reCAPTCHA メール送信失敗

一度目のメール送信はreCAPTCHAをチェックすればOKですが、短期間で何度も送信すると、セキュリティ対策として確認用画像が表示されるようになります。

reCAPTCHA確認用画像

これでボットからのスパムメールはほぼ100%ブロックすることができます。

ただ、reCAPTCHAの「私はロボットではありません」というチェックや、突然表示される画像選択に違和感を感じる方もいるようで、reCAPTCHAの設置が好まれない場合もあります。

そんな時は操作不要で目立たない別タイプのreCAPTCHA「Invisible」を導入します。

Invisible reCaptcha for WordPressの設定

InvisibleタイプのreCAPTCHAは、プラグイン「Invisible reCaptcha for WordPress」を使って設定します。Checkタイプの時と同様に、Google「reCAPTCHA」にログインして、Invisibleタイプ用のAPIキーを取得してください。

Google My reCAPTCHA

reCAPTCHAの設定はCheckの時と同様です。「Choose the type of reCAPTCHA:」はInvisibleを選択して、「Register」をクリックします。

Invisible reCAPTCHA設定

表示されたサイトキーとシークレットキーをコピーしてください。

Invisible reCAPTCHA設定

続いて「Invisible reCaptcha for WordPress」をインストールします。「プラグインを追加」から検索してインストールしてください。

プラグイン Invisible reCaptcha for WordPress

次に、ダッシュボードの「設定」→「Invisible reCAPTCHA」で、Invisible reCaptcha の設定を行います。先ほどコピーしたサイトキーとシークレットキーを貼り付けます。

「Language」は日本語を選択、「Badge Position」はデフォルトの右下でいいでしょう。「Badge Position」をInlineにすると、送信ボタンの下に表示されます。最後に「変更を保存」をクリックします。

Invisible reCAPTCHA設定

あとは「Contact Forms」から「Enable Protection for Contact Form 7」にチェックを入れて「変更を保存」すればOKです。

Invisible reCAPTCHA設定

メールフォームを見ると、reCAPTCHAバッヂは隅に小さく表示されて目立たないし、チェック等も必要ないので違和感はないですね。

ContactForm7 Invisible reCAPTCHA設定

あとは好みに応じてreCAPTCHAの設置場所を変更してください。

スポンサーリンク

ContactForm7 reCAPTCHA設定まとめ

reCAPTCHAのボット不正操作検知システムはとても優秀で、ContactForm7にreCAPTCHAを設定すると、スパムメールはほぼ100%防止できます。

また、Invisible reCAPTCHAにはコメントフォームの保護や、ログイン画面の保護機能もあり、設定の「WordPress」から各項目にチェックを入れるだけで有効になります。

Invisible reCAPTCHA WordPress設定

コメントフォーム保護にチェックすると、スパムコメント対策プラグインのAkismetは不要になります。実際にreCAPTCHAを設定したサイトでは、Akismetを外しました。

ContactForm7にreCAPTCHAを設定するなら、サイト訪問者の操作が不要で違和感もなく、スパムコメントも防止できる「Invisible reCAPTCHA」をオススメします。

ContactForm7の関連記事です。よかったらこちらもどうぞ・・・

関連記事 WordPressの問い合わせフォーム作成プラグイン Contact Form 7の使い方

関連記事 Contact Form 7 で送信完了ページ(サンクスページ)に移動させる方法

関連記事 Contact Form 7 に確認画面と完了画面を追加する

タイトルとURLをコピーしました