『reCAPTCHA v3』を問い合わせページのみ&左側に表示させる方法:その1

2025/1 更新

『Google Cloud Platform』の項目が増えていて、この記事の方法では先に進めなくなったので、『reCAPTCHA v3』をWordPressのサイト&Contact Form7で表示させる方法 を新たに追加しました。今後はこちらにて確認してください。

最近お問い合わせページにちょくちょく迷惑メールがくるようになりました。『Akismet Anti-Spam』も有効にしたり、簡易のクイズも入れたりして迷惑メール対策はしてたんですけどね。

ま、来るものは仕方ない。ということで、『reCAPTCHA v3』を導入したのですが、これがそのまま導入するとサイトの全ページに表示され、さらに右下にずっとでているので、かなり邪魔なんですよね。

reCAPTCHAを問い合わせページ&左側に表示させる1

と言うわけで今回はこの『reCAPTCHA v3』を問い合わせページのみに、そして左側に表示させる方法を書きたいと思います。
ちなみに環境は、Wordpressで「Contact Form 7」のプラグインを使用での話になります。

目次

  1. 『reCAPTCHA v3』にサイトを登録をする
    1. サイトの登録をする
    2. WordPressに『reCAPTCHAのAPIキー』を登録する

『reCAPTCHA v3』を問い合わせページのみ&左側に表示させる方法:一覧

『reCAPTCHA v3』にサイトを登録をする

『reCAPTCHA v3』を使用するには、使用するサイトを登録して「API キー(reCAPTCHA の API を使用するためのキー)」を取得する必要があります。

そのためにはまず「Googleのユーザーアカウント」に登録している必要があるのですが、ここは簡単なので、Googleのユーザーアカウントに登録されている前提で進めます。

サイトの登録をする

https://www.google.com/recaptcha/admin/ からサイトの登録をします。API キーの管理などもこちらから行うことができます。

「reCAPTCHA-v3」サイト登録

上記のように必要情報を入力&選択して、送信(登録:Register)します。

問題なく登録されると以下のようなページに推移し、サイトキーとシークレットキー(APIキー)が表示されるので、コピー or このページは開いたままにしておきます。

「reCAPTCHA-v3」APIキー画面

ちなみにAPIキーは、設定の画面からも確認することもできますので『画面消しちゃった!』といった場合でも、焦らないでくださいね!

WordPressに『reCAPTCHAのAPIキー』を登録する

サイドメニューの「お問い合わせ」の「インテグレーション」の「インテグレーションのセットアップ」に、先ほど入手したサイトキーとシークレットキー(APIキー)をコピペし、登録します。

「reCAPTCHA-v3」APIキー入力1

「reCAPTCHA-v3」APIキー入力2

これで、reCAPTCHAがサイトに表示され、セキュリティレベルはアップしたのですが、全ページの右下に『reCAPTCHA』アイコンが表示されるので、邪魔で仕方ありません。。
特にページトップに戻るのボタンなどとかぶると、邪魔で邪魔で仕方ない。。

右下のreCAPTCHA

というわけで次は「問い合わせページにのみ&左側に表示させる方法」を、『reCAPTCHA v3』を問い合わせページのみ&左側に表示させる方法:その2にて。

Google AdS



関連記事

WPで全ページ見れなくなった時

WordPressの記事がトップページ以外、全部見れなくなった時の対処方法(404 error)


年末にサーバーの移転を進めていたのですが、以前に何度かサーバーの移転やWordpressの引っ越し等々していたので、大変…

記事を読む▷


onMouseOver、onMouseOutで、簡単にテキストを切り替える!


前回のonMouseOver,onMouseOutで簡単に画像を切り替える!の続き、応用編です。 実はこちらサイト…

記事を読む▷


ページネーションがおかしい!次のページに行かない原因と解決方法|サムネイル

ページネーションがおかしい!次のページに行かない原因と解決方法|WP-Pagenavi・表示設定を見直す


今まで何度もWordPressのテンプレートをカスタマイズし、問題なくページネーションは機能していたのですが、なぜか今回…

記事を読む▷


section-h1

【SEO対策】[section]等にそれぞれ [h1]等のhタグを入れて使う仕様について


ここ数年、や[article]に、それぞれ[h1]等のhタグを入れるようにhtmlを記述してきました。正確には、等が追加…

記事を読む▷


共通パーツ(header,footer等)を読み込んで編集を楽にする方法:PHP編 サムネイル

共通パーツ(header,footer等)をPHPで読み込んで編集を楽にする方法


headerやfooterに限らず、同じパーツを使っている場合は、共通パーツを読み込ませて管理した方が断然楽ちんです。で…

記事を読む▷


Message

メールアドレスが公開されることはありません。 が付いている欄は必須項目です

このサイトはスパムを低減するために Akismet を使っています。コメントデータの処理方法の詳細はこちらをご覧ください