reCAPTCHAv3のロゴ（バッジ）を正規の方法で非表示するには

WordPressのプラグイン「ContactForm7」でreCAPCTHAv3を使用している方で、
reCAPTCHAv3のロゴ（バッジ）の表示を消したいという方は多いのではないでしょうか。
右下というと、ページトップへ戻るボタンが設置されているケースの多い大切なエリアです。ページのトップに戻るボタンの上にreCAPTCHAv3のロゴ（バッジ）が表示されてしまったら、Webサイトの利便性が非常に悪くなってしまいます。

しかし、reCAPTCHAv3のロゴ（バッジ）の表示を消してしまいたいからといって、reCAPTCHAのロゴは勝手なやり方で消してしまうと規約違反になってしまいます。そこでこの記事ではGoogle推奨の方法でロゴを消す方法を説明します。

※Wordpressのプラグイン「ContactForm7」でreCAPCTHAv3を使用しているという前提があっての記事となります

reCAPCTHAv3とはなにか

そもそも、reCAPTCHAとは、お問い合わせや会員登録時に情報を登録する際、対象の画像を選んだり、「私は、ロボットではありません」といったチェックボックスをチェックしたりする仕組みのことです。

この仕組みを利用すれば、不正アクセスや情報の改ざんなどのリスクを最小限に抑えられるようになります。いくつかバージョンが公開されているのですが、reCAPCTHAv3の最大の特徴は、ユーザーに対象の画像を選ばしたり、チェックボックスにチェックを入れたりという仕組みがなくなり、特別な操作をしなくても高いセキュリティを維持できることです。

また、reCAPCTHAv3は、ユーザーの行動をスコアとして学習し、人、またはロボットなのか、動きで判別できます。

reCAPTCHAv3のロゴ（バッジ）をGoogle指定の方法で非表示にする

reCAPTCHAv3のロゴを消す方法には、いくつかの種類がありますが、functions.phpにコードを記述する方法とプラグインを使用する方法は、一定の知識や技術が必要となるため、初心者にはおすすめしません。

そのため、Googleが公式サイトで公開している方法に沿ってロゴを消していきます。英文で記述されていますが、やり方は非常に簡単です。Googleの公式サイトには、「reCAPTCHAv3のロゴを非表示にするには、どのような必要がありますか？」という質問に対して、「Google公式サイトで指示されている文章を記載すれば、問題はない」と記載されているため、この内容に従っていきます。

まずはお問い合わせにHTMLを追加

先ほどもお伝えしたように、reCAPTCHAv3のロゴを非表示にしていることを明記せずに非表示にすると規約違反になるため、お問合せフォームの送信ボタンの下に、下記のHTMLをペーストしましょう。これによりサイト自体でreCAPTCHAが使われていることを明記できます。

上記のHTMLコードをコピーしたら、コンタクトフォームに記述していきます。Wordpressを利用しているのなら、記述方法は非常に簡単です。まずは、ダッシュボードにアクセスします。ダッシュボードにアクセスしたら、お問い合わせからコンタクトフォームへと移動します。

コンタクトフォームへアクセスしたら、編集画面を開いてください。すると、“お名前”や“メールアドレス”、“題名”など、コンタクトフォームに関するHTMLの記述が見えるでしょう。その最後の記述の部分に、上記のHTMLを記述して保存します。

この記述をしておけば、Google公式サイトで指示されている文章を記載したことになりますので、reCAPTCHAv3のロゴ（バッジ）を非表示にしても問題ありません。しかし、上記のHTMLを記述したからといって、非表示になるわけではありません。CSSを追加するという手順が必要のため、順番に進めていきましょう。

CSSを追加してロゴを非表示に

Googleの公式ページにあるように、スタイルシートに下記の記述を追加しましょう。

上記のCSSコードをコピーしたら、WordPressのダッシュボードへアクセスしましょう。先ほどは、お問い合わせからコンタクトフォームへとアクセスしましたが、CSSのコードは、別の場所に追加します。

新たにCSSコードを追加する場合は、外観へアクセスし、カスタマイズに移動しましょう。現在、使用しているテンプレートによっては、追加CSSというものが表示されるケースがあるため、臨機応変な対応が必要です。

CSSの編集ページが開いたら、先ほどのCSSコードをコピーして貼り付けます。その内容を保存すれば、これでロゴの非表示は完了です。

【最後に】ロゴの非表示の確認を忘れずに

Contactform7を利用してロゴの非表示の仕方について解説していきました。手順通りにできているのであれば、reCAPTCHAv3のロゴ（バッジ）が非表示になっているはずです。作業が終わったら、reCAPTCHAv3のロゴが消えているのを確認するのはもちろん、お問い合わせフォームに下記の文言が正しく表示されているか調べてください。

This site is protected by reCAPTCHA and the Google
Privacy Policy and
Terms of Service apply.

もし、上記の文言が表示されておらず、reCAPTCHAv3のロゴが消えていた場合、規約違反となってしまいます。そのような事が知られれば、ペナルティを受けるリスクがあるため、早急に手順に間違いはなかったか見直してください。

HTMLやCSSコードをコピーして貼り付けるだけなので特別難しい作業はなかったかと思います。ぜひやってみてください。