見出し画像

reCAPTCHA v3をContact Form7に導入

※自分用の備忘録です。

reCAPTCHAにログインをする

Googleのアカウントでログインでき、無料で使用することができます。(有料版もあります)

導入したいサイトを登録する

メニューにある「v3 Admin Console」に必要事項を記述し送信します。

  • ラベル「自分のサイトの名前などを入力します」

  • reCAPTCHAタイプ「reCAPTCHAタイプを選択します」

  • ドメイン「設定したいサイトのドメインを入力します」

  • オーナー「ログインしたGoogleアカウントのメールアドレスが表示されます」

  • reCAPTCHA利用条件に同意をする「チェックを入れます」

上記項目を入力後送信を押します。

v3 Admin Consoleのメニューにある「+」から複数のサイトを登録することも可能です。

サイトキーとシークレットキーの確認

必要事項を送信すると設定に必要なキーが表示されます。

このキーをContact Form7に設定します。

WordPressでの操作

reCAPTCHAを導入するWordPressの管理画面に入り「お問合せ」→「インテグレーション」を開きます。

reCAPTCHAという項目があるのでセットアップを開き、サイトキーとシークレットキーをコピペします。

reCAPTCHAの確認

導入したホームページを開くと右下にreCAPTCHAのマークが表示されます。

reCAPTCHAのマークの非表示

ホームページのデザインによってはreCAPTCHAのマークを非表示にしたい場合があります。

公式で下記の文言をfooterなどに入れることで非表示にすることが認められています。

このサイトはreCAPTCHAによって保護されており、Googleの<a href = "https://policies.google.com/privacy">プライバシーポリシー</a>と<a href = "https://policies.google.com/terms">利用規約</a>が適用されます。

非表示用のコードは外観の追加CSSやテーマのCSSに記述すると反映されます。

.grecaptcha-badge {
  visibility: hidden;
}

この記事が気に入ったらサポートをしてみませんか?