プラグイン Contact Form 7にGoogleの画像認証(reCAPTCHA)を実装する

Contact Form 7, 画像認証

こんにちは! 

WordPressで記事を書いていると、次第にサイトのコンテンツも充実し、ある日突然お問い合わせフォームから大量のスパムメールが~~~~!なんて事になるやもしれません。

ものすごく簡単にお問い合わせフォームが設置できるプラグインContact Form 7ですが、有名だけに穴があると一斉に攻撃が仕掛けられてきます。

そういうことにならないよう、対策しましょう♪

Contact Form 7にGoogleの画像認証(reCAPTCHA)を実装する

 reCAPTCHA API keysを取得する

  1. 「お問い合わせ」「インテグレーション」を右クリックして新しいタブで開きます。
  2. reCAPTCHAキャプチャ画面

  3. 右上の「google.com/recaptcha」 の文字をクリックします。
  4. reCAPTCHAキャプチャ画面

  5. Googleアカウントにログインします。
  6. reCAPTCHAキャプチャ画面

  7. 画面右上の「Get reCAPTCHA」ボタンをクリックします。
  8. reCAPTCHAキャプチャ画面

  9. 下のように設定します。
    入力するドメイン名は今回reCAPTCHAを設置したいドメイン名です。サイトURLではないのでご注意ください。
  10. reCAPTCHAキャプチャ画面

  11. Site key と Secret key の確認をします。
  12. reCAPTCHAキャプチャ画面

Contact Form 7と raCAPTCHA をインテグレートする

  1. WordPressの管理画面に戻り「キーを設定する」をクリックします。
  2. reCAPTCHAキャプチャ画面

  3. さきほどgoogleのサイトで確認したSite key と Secret keyをそれぞれ入力し保存します。
  4. reCAPTCHAキャプチャ画面

お問い合わせフォームに画像認証を追加する

  1. 「お問い合わせ」「コンタクトフォーム」を開いて、画像認証を追加したいフォームの「編集」をクリックします。
  2. 右端にある「reCAPTCHA」を開いて「タグの挿入」をクリックします。
  3. reCAPTCHAキャプチャ画面

  4. 下の箇所にタグが挿入出来ていることを確認して保存します。
  5. reCAPTCHAキャプチャ画面

  6. 実際のお問い合わせフォームに下のような画像認証が設置されていれば完了です!

あとがき

ある日やってきた5秒に1通というすさまじい数のスパムメール!
メールは携帯に転送していたので、チャンチャラ♪チャンチャラ♪着信音が鳴り響きます(笑)
その時ネットで対策を調べると、送信前にチェックを入れてもらえるチェックボックスを設置するといい というようなアドバイスがあり、そうしていました。
でも、この画像認証の方がもっといいですよね!
設置も簡単だし、利用しない手はないですよ!

関連Contact Form 7で作ったお問い合わせフォームのカスタマイズはこちら

0

プラグイン

Posted by どらみ