free web hit counter
 

reCAPTCHA v3 新バージョンの使い方|スパム避けツール


公開日:2019年1月6日
最終更新日:2019年9月15日

問い合わせ用Contact Form7の不具合の原因


昨年末(2018年12月)に、このブログに入れている、「問い合わせフォーム」から送信できない!

という報告メールを読者さんから頂戴しました。


確認してみたら、確かに、投稿ができなくなっていました。

使っているフォームは、Contact Form 7です。

原因は、このブログのWordPressを5.02にアップデートしたことかもしれません。(確証はありません)

とにかく、“問い合わせフォーム” が送信できないのは困るので、まずは、プラグインの入れ直しをしてみました。

アップデート案内に従ってContact Form 7を
「バージョン 5.1.1」にアップデート。修正してみました。

修正作業でわかったのは、Contact Form 7をバージョンアップしたら、設置しているスパム避けのツール「reCAPTCHA2」が使えない様になっていました。以下、修正の備忘録です。





スポンサードリンク





 

Contact Form 7のフォームが送れない!


 

このブログに入れている問い合わせフォームは以下の様なもの。

チェックボックスが表示されるべき場所に、こんな表示。[recaptcha]のテキスト。

↑クリックで拡大



フォームを見てみると、下の方に[recaptcha]というテキストが出ています。

今まで 使っていた “reCAPTCHA2” では、このフォームの下にの部分には以下のような が表示されていたはず・・


しかも、送信テストをしてみたら、以下の表記。


修正したら、無事送信ができるようになりました。


reCAPTCHAのバージョン2と3の違いとは?


実は2018年12月に “reCAPTCHA” がバージョン2の他に3が出ていました。

v2とv3の違いですが、v2では前述のように「私はロボットではありません」の表示がなくなりました。

v3にすると「私はロボットでありません」の表示がなくなるので、訪問者のユーザーはフォーム送信時にチェック挿入作業が不要になります。

ご覧のページの右下にありますが、こんな表示。


カーソルを乗せると、このように動きます。


 “reCAPTCHA v3” が導入されると、このマークが出ます。

v2を入れている状態で、Contact Form 7 の「問い合わせ」から、[recaptcha]のテキストを削除しておきます。



設定側としては、フォーム編集画面から、[recaptcha]を挿入するボタンが無くなります。

 

reCAPTCHA v3 設定手順


今までv3を入れていた場合は、一度、「インテグレーション」からキーを削除します。

設定手順は、reCAPTCHA v3 のサイトにアクセス、右上のログインボタンからGoogleのアカウントでログインします。

新しく「reCAPTCHA v3」にボタンチェクして、

 


  ↑必要事項を記入。ドメインは、「http(s)://」の部分は不要です。

「Accept~~」の使用承諾のチェックを入れて「Register」をクリック。


  ↑  ボタンを押すと ↓ この画面が出てきます。


ここで2つのキー、「Site Key」と、「Secret Key」をメモしておきます。

 

Contact Form 7にreCAPTCHA v3 を設定する


ブログには、問い合わせフォーム、Contact Form 7 を入れていることが前提になります。

※導入方法と使い方はこちら→ https://1stepup.com/wp/contactform7/

ダッシュボードから「お問い合わせ」を開きます。


「インテグレーションのセットアップ」をクリック。


ここで、先程メモしておいた2つのKeyを記載、保存します。


ここまでの作業で、Contact Form 7 で作った “問い合わせフォーム” で無事送信ができるようになりました。

 

「header」へのソース追加


先の、reCAPTCHA v3 のサイトにログインしたページには、2つのKeyの他、次のような記述がありました。

↑クリックで拡大



このコードをそのまま、WordPressで今使っているテーマの「headr.php」ファイルにコピペしてファイルを更新します。

以上で完了です。

 

 

コメント(※時系列は下に行くほど旧く表示)

現在、この記事へのコメントはありません。

コメントを投稿する




コメント内容

スポンサードリンク
 
WPEditor

サイトマップ

迷ったらサイトマップ
当サイト内が一目瞭然



サイト内検索

カテゴリ一覧

ページ概要
最近の投稿
当ブログの人気記事
最近のコメント

ページの先頭へ

     
【サイト更新日】
   //サムネイルを取得 //ここから構造化データの記述