Contact Form 7 (v5.1～)＋reCAPTCHA (v3) で画面右下のロゴを消す

reCAPTCHA v3 のロゴが邪魔

お問い合わせフォームのプラグインとして有名な Contact Form 7 が Version 5.1 から reCAPTCHA Version 3 に対応しました。

別の言い方をすると、Contact Form 7 の Version 5.1 から reCAPTCHA Version 2 が使えなくなりました。reCAPTCHA v2 は下図のようなロゴですね。v2 のロゴは、Contact Form 7 の「お問い合わせ」ページの任意の位置に表示することができました。私はこれで満足だったんですが。

新しい Contact Form 7 で reCAPTCHA v3 を使用すると、基本的にはサイトの全ての記事の画面の右下にロゴが強制的に表示されてしまうようです（CSS をいじる等すればある程度修正可能なようですが。なお、reCAPTCHA を適用するページにはロゴを表示することが義務付けられているらしい）。

ちょっと待ってください・・・私のサイトでは、すでに画面の右下には「トップへ戻るボタン」を表示してるんです。

新しいバージョンの Contact Form 7 で reCAPTCHA v3 を使用したら、PC での表示がこうなってしまいました・・・。

被ってます。あの～被ってますよ～～～。
(^_^#) ﾋﾟｷ
reCAPTCHA のロゴが常に「トップへ戻るボタン」の青い円を覆い隠してしまいます。青い円の左端がわずかに見えてるところが一層哀れです。

スマホで見るとこう。

・・・邪魔・・・。
(^_^ﾒ) ﾋﾟｷ

reCAPTCHA v3 のロゴを v2 のように表示するプラグイン

調べてみたんですが、Contact Form 7 の設定を調べても、reCAPTCHA v3 の設定を見ても、このへんを調整するようなオプションが見つかりませんでした。

疲労感を感じつつネット検索して調べていたら、やっとこの問題を解決するプラグインを発見！

「Invisible reCaptcha for WordPress」というプラグインがまさに求める機能を持ってました。

新しい Contact Form 7＋reCAPTCHA v3＋このプラグインを使用すると、下図のように（reCAPTCHA v2 のように）「お問い合わせ」フォームの下のみに reCAPTCHA v3 のロゴを表示させることができます。

Invisible reCaptcha for WordPress の設定方法

設定方法ですが、まず「Invisible reCaptcha for WordPress」をインストールして有効にします。

次に、Contact Form 7 の［インティグレーション］に reCAPTCHA の設定をしている場合は、削除しておきます。

そして WordPress の［設定］＞［Invisible reCaptcha］＞［Settings］で

• [Your Site Key］と［Your Secret Key］に reCAPTCHA v3 の Site Key と Secret Key を設定し、
• [Language］を Japanese にして、
• [Badge Position（ロゴの位置）］を Inline（インライン）にしたら、

［変更を保存］をクリックします。

次に WordPress の［設定］＞［Invisible reCaptcha］＞［Contact Forms］の設定に移動して、［Enable Protection for Contact Form 7（Contact Form 7 の保護を有効にする）］にチェックを入れて［変更を保存］をクリックします。

以上です！