【超簡単!】Google reCAPTCHAの設定(Contact Form7)

ブログ運営

最近になってなぜか迷惑メールが頻繁に来るようになりました。一応、対策として「Akismet」というプラグインを使用しており、これまではとくに迷惑メールが来ることはなかったんですが…

さすがに毎日数件の迷惑メールを放置するのも鬱陶しいので、Googleが提供するセキュリティサービス「Google reCAPTCHA」の設定をしました。設定方法を解説してくれるサイトも多く助かるんですが、なぜか無駄に難しい話までされるところが多く、設定方法だけサクッと知りたい方のために手順を記しておきたいと思います。

なお、これは「Contact Form 7」を使用している場合に限ります。また、Googleアカウントが必要なのでアカウントがない方は先にGoogleアカウントの作成をお願いします。

スポンサーリンク

Google reCAPTCHAの設定

まずは「Google reCAPTCHA」に移動し、右上の「v3 Admin Console」を選択。

リキャプチャ

Googleアカウントでログイン後、右側の「+」をクリック。

続いて、各項目の入力をしていきます。

「ラベル」はどのサイトに使用しているか分かるように名前を付けるだけです。僕の場合、この「金と共に生きぬ」に使用するのでブログ名をそのまま入力。

「reCAPTCHAタイプ」は「v3」に。正直、詳しいことはよく分からん。

「ドメイン」はそのままドメインを入力。ちなみに「https://」の部分は不要です。

「オーナー」にはおそらく最初からGmailのアドレスが入力されていると思います。

利用条件に同意するにチェックを入れ、送信をクリックすると、サイトキー・シークレットキーが発行されます。キーは後ほどコピペで使うので、そのページを残したままWPのContact Form7の設定をしていきます。

Contact Form7にキーを設定する

管理画面の「お問い合わせ」のなかに「インテグレーション」という項目があるので、それをクリックし、reCAPTCHAの「インテグレーションのセットアップ」を選択。

するとキーを入力する画面になるので、先ほどのサイトキー・シークレットキーをそれぞれの箇所にコピペしましょう。これでひとまずreCAPTCHAの設定は完了。

ただ、このままだとサイトの右下にへんてこりんなロゴが出てしまいます。

これがあるとページ上部に戻るためのボタンと被ったり、スマホで見たときに結構ジャマになるので、このロゴを消すための設定をしておきましょう。やり方はいくつかあるようですが、Googleの推奨とされているやり方を紹介します。

reCAPTCHAのロゴを消す

まず「お問い合わせ」→「コンタクトフォーム」から設定画面を開きます。

続いて、フォームの最後の行に以下のコードを記述します(コピペでOK)。

This site is protected by reCAPTCHA and the Google
    <a href="https://policies.google.com/privacy">Privacy Policy</a> and
    <a href="https://policies.google.com/terms">Terms of Service</a> apply.

続いて、管理画面の「外観」→「カスタマイズ」に進み、「追加css」に以下のコードを記述。

.grecaptcha-badge { visibility: hidden; }

これでロゴが消えているはずなので、自分のサイトを開いて確認しておきましょう。ちなみに、「/**/」で囲った部分はそのコードで何をしているか分かるようにしているだけなので、記述する必要はありません。

まとめ

ちょっと面倒くさそうに思えますが、やってみるとあっという間に終わる作業です。これで今のところ迷惑メールは届かなくなっていますが、あまり詳しいことまで分からないので「同じようにしたのに上手くいかない!」という場合は他のサイトで確認していただくようお願いします。

ブログ運営
スポンサーリンク
hideをフォローする
金と共に生きぬ

コメント