reCAPTCHA v3を導入すると右下に見慣れたバッジが常に表示されます。
Contact form7とreCAPTCHA v3をインテグレーションで連携すると、すべてのページでreCAPTCHA v3のバッジが表示されます。PCでは気にならないですが、スマホでは画面が狭くなり消したくなります。
reCAPTCHA v3のバッジを表示しないのは規約違反だ!というのを見かけたことがありますが、実はそれは嘘でした。
reCAPTCHA v3のGoogleの公式FAQページに以下のような記述があります。
reCAPTCHAバッジを非表示にしたい、何が許可されていますか?
この記事では、Google公式で認められているreCAPTCHAバッジを完全に非表示にする方法についてまとめています。
reCAPTCHAバッジを非表示にしたい、何が許可されていますか?
ユーザーフローにreCAPTCHAブランドを視覚的に含める限り、バッジを非表示にすることができます。
次のテキストを含めてください:
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.
バッジを消すためには、以下の記述を追加してください。
.grecaptcha-badge { visibility: hidden; }
Contact form7の場合は具体的にどうしたらよいのか?
ダッシュボードのお問い合わせにあるフォーム設定に、先ほどの記述をそのままコピペすればフォームとともに表示されます。
<label> お名前 (必須)
[text* your-name] </label>
<label> メールアドレス (必須)
[email* your-email] </label>
<label> 電話番号 (任意)
[tel* your-tel] </label>
<label> 題名
[text your-subject] </label>
<label> メッセージ本文
[textarea your-message] </label>
[acceptance acceptance-965 optional] 個人情報ご提供のご同意【必須】 [/acceptance]
[submit "送信"]
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.