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

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

ContactForm7のスパム対策 reCAPTCHA

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

※ 最新のContactForm7 バージョン5.1から、reCAPTCHA v3 APIを使うようになりました。この記事は以前のreCAPTCHA v2の解説なので、以下の記事を参照して最新のreCAPTCHA v3を設定してください。

ContactForm7にreCAPTCHA v3を設定する
WordPressプラグイン「ContactForm7」で、reCAPTCHAの最新バージョン「reCAPTCHA v3」を設定してみました。最新のContactForm7 バージョン5.1からは、reCAPTCHA v3 APIを使うようになっています。

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

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

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

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

「私はロボットではありません」チェックボックスはContactForm7上で設定できるのでプラグイン不要ですが、非表示reCAPTCHAバッジはプラグイン「Invisible reCaptcha for WordPress」を使って設定します。

スポンサーリンク

reCAPTHCAアカウント登録

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

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

reCAPTCHA設定 google.com/recaptcha/

ContactForm7 reCAPTCHA設定

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

Google My reCAPTCHA

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

reCAPTCHA Googleアカウント

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

contactform7 reCAPTCHA設定

reCAPTHCA 「私はロボットではありません」チェックボックスの設定

では、「私はロボットではありません」チェックボックスのreCAPTCHAを設定しましょう。

ラベル: 設置するサイトの名前等を入力すればOKです。
reCAPTCHAタイプ: 「私はロボットではありません」チェックボックスを選択します。
ドメイン: reCAPTCHAを設置するサイトのドメインを入力します。http:// や https:// 、下層のディレクトリ等は入力不要です。

あとは「reCAPTCHA 利用条件に同意する」にチェックを入れて「送信」をクリックします。「アラートをオーナーに送信する」は任意なので、どちらでも構いません。

contactform7 reCAPTCHA設定

「サイトキー」と「シークレットキー」をコピーしてください。この2つのAPIキーを入力すると、ContactForm7でreCAPTHCAが使えるようになります。

contactform7 reCAPTCHA設定

スポンサーリンク

ContactForm7 APIキー入力

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

ContactForm7 reCAPTCHA設定

さきほどコピーしたサイトキーとシークレットキーを入力して「保存」をクリックします。

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 reCaptcha for WordPressの設定

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

Google My reCAPTCHA

reCAPTCHAの設定は「私はロボットではありません」チェックボックスの時と同様です。「reCAPTCHAタイプ」は「非表示reCAPTCHAバッジ」を選択して、「送信」をクリックします。

Invisible reCAPTCHA設定

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

contactform7 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%防止できます。

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

Invisible reCAPTCHA WordPress設定

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

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

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

Contact Form 7の使い方や設定方法
WordPressに問い合わせフォームを設置できる多機能なプラグイン「Contact Form 7」の記事一覧です。フォームに入力した内容の確認画面や、メール送信後の完了画面を追加したり、メール送信後のサンクスページ移動方法、スパムメール対策のreCAPTCHAv3設定方法も紹介しています。

他の reCAPTCHA 設定方法や使い方は、以下でも紹介しています。

reCAPTCHAの設定方法と使い方
WordPressのスパムコメントや不正ログインを防止するために、プラグインを用いてreCAPTCHAを設定する方法を紹介しています。また、メールフォーム設置プラグイン「ContactForm7」にreCAPTCHAを設定して、ボットによるスパムメール送信を防止する方法も紹介しています。
タイトルとURLをコピーしました