『reCAPTCHA v3』を2ページ以上表示させる時の方法(問い合わせ+α・固定ページ・投稿ページetc..)

以前『reCAPTCHA v3』を問い合わせページのみ&左側に表示させる方法:その2を書いた時は、問い合わせページにのみ『reCAPTCHA v3』を設置しました。

ですが、今回「問い合わせページ」とは別に送信機能を使ったページを「Contact Form 7」を使って作成したのですが、なぜか送信がされなかったんですよね。ですので色々調べてはみたのですがなかなか答えに辿り着けず。。

で、ふと「Contact Form 7」で作った「問い合わせページ」を見てみると『reCAPTCHA v3』がついているのに、新たに作ったページには『reCAPTCHA v3』がついてない!ということに気付き、これが原因かも。と思い『reCAPTCHA v3』を新たなページにも設置してみたところ、無事送信できた!のですが、簡単には設置できなかった。。

『reCAPTCHA v3』を2ページ以上表示させる時の方法(問い合わせ+α・固定ページ・投稿ページetc..)

ということで、今回は『reCAPTCHA v3』を「問い合わせページ」だけではなく、2ページ以上表示させる時の記述方法です。
環境は前回同様、Wordpressで「Contact Form 7」のプラグインを使用での話になります。

目次

  1. 『reCAPTCHA v3』を1ページにのみに表示させる
  2. 『reCAPTCHA v3』を2ページ以上に表示させる

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

『reCAPTCHA v3』を1ページ(問い合わせページ)にのみに表示させる

これは以前書いたものと同じなのですが、functions.phpに以下の記述をします。ちなみに問い合わせページは固定ページで、パーマリンクは「contact」です。

add_action( 'wp_enqueue_scripts', function() {
	if(is_page('contact')) return;
    wp_deregister_script('google-recaptcha');
}, 100, 0);

これで「Contact Form 7」によって追加されるreCAPTCHA関連のコードがすべて読み込まれなくなります。
最後の4行目は優先順位で、デフォルトでは「10」なのですが、このままだと機能しない場合があるの「100」に指定しています。

ちなみに以前(2021/3頃)までは、ここを指定しなくても問題なかったようですね。(詳細は『reCAPTCHA v3』を問い合わせページのみ&左側に表示させる方法:その2にて)

『reCAPTCHA v3』を2ページ以上に表示させる

固定ページと固定ページの場合

これが今回なかなか辿り着けなかっていた記述です。こちらも functions.phpに記述をします。

add_action( 'wp_enqueue_scripts', function() {
	if(is_page(['contact','new-page'])) return;
    wp_deregister_script('google-recaptcha');
}, 100, 0);

固定ページ・新たなページのパーマリンクは、それぞれ「contact・new-page」としています。

ちなみに最初は上記の2行目を↓このように並列にしていたのですが、

	if(is_page('contact','new-page')) return;

これではうまく表示されず、上記の記述を見つけるのに苦労しちゃった。というわけなんですね。

というわけで、ここでは↓のように[ ]で括って記述してくださいね。

	if(is_page(['contact','new-page'])) return;

固定ページと投稿ページの場合

固定ページと投稿ページの組み合わせの場合は以下になります。

add_action( 'wp_enqueue_scripts', function() {
  if(is_page('contact')) return;
  if(is_single('new-page')) return;
    wp_deregister_script('google-recaptcha');
}, 100, 0);

あとこれは以前も記載しましたが念のため。

『reCAPTCHA』を使っているページには、必ずロゴを表示しなければいけないという決まりがありますので、display:none;等で消しちゃうと規約違反になる のでご注意くださいね。

Google AdS



関連記事

onMouseOver、onMouseOutで、簡単に画像を切り替える


今までマウスオーバー等で画像を切り替える時は、jQueryを使ったり、cssで画像を重ねてopacityで画像を透過させ…

記事を読む▷


section-h1

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


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

記事を読む▷


WordPressの管理画面でタグをカテゴリーのように選択する&一括で選択解除するボタンも設置する方法:オリジナルカスタムフィールドの記述方法

WordPressの管理画面でタグをカテゴリーのように選択する&一括で選択解除するボタンも設置する:オリジナルカスタムフィールドの記述方法


Webの知識がない方でも簡単にページ作成や修正ができるよう、オリジナルのカスタムフィールドを使って投稿を管理できるように…

記事を読む▷


Thumbnail_Icon_firefox_bug

Firefoxでなぜか消える、Tableのborder対策、cssのみでの解決法


Firefoxでなぜか消えてしまうTableのborder、いつもじゃなく、たまになのでこれがやっかい。。原因がわからな…

記事を読む▷


画像やテキストを中央(上下左右真ん中)に配置する方法


普通にtext-align:center;や、margin:0 auto;等でテキストや写真を真ん中に配置したつもりでも…

記事を読む▷


Message

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

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