2019年最新【Contact Form 7】reCAPTCHA v3 導入とフォームのコンバージョン率設定
【景品表示法に基づく表記】本サイトのコンテンツには、商品プロモーションが含まれている場合があります。
カイエダです。
WordPressの人気プラグイン「Contact Form 7」の最新コンバージョン率測定の設定方法と、reCAPTCHA v3導入方法をまとめました。
参考にしてみてください！
この記事の目次
プラグイン Contact Form 7とは
葛飾北斎の浮世絵の印象が強いですよね。
Contact form7は、WordPressに問い合わせページを作るときにとても便利なプラグインの代表です。
本来、自分で問い合わせページを作成する場合には、ある程度難しい専門的な知識が必要になります。
Contact form7 はカンタンに設定できるので、WordPressサイトであれば、専門的な知識のない方でも、簡単に問い合わせページを作ることができます。
日本の開発プラグインではありますが、日本のみならず、海外でも広く使われています。
カンタン！Contact Form 7での reCAPTCHA v3 導入方法
まずはreCAPTCHA v3の「サイトキー」と「シークレットキー」を取得します。
以下は該当ページからの引用部分も含みます。
１、専用Webサイトへ行く
こちらのWebサイトをご覧ください。
画像中央の 「Learn more ボタン」を押します。
次のようなページが表示されます。
２、テキストリンク「here」をクリック
赤枠にある「here」というリンクをクリックしてください。
３、新しいサイトを登録する
- ラベル
複数登録したときに判別できるように、わかりやすい名前を「ラベル」に入力し設定します。- reCAPTCHAタイプ
「- ドメイン
フォームを設定するドメインを設定します。
複数のドメインを設定できます（1行1ドメイン）。
メールフォームのドメインは必ず指定しましょう。
たとえば、私の場合はAgentMailというメルマガ配信システムを使っていますが、メールフォームのドメインが「www.agentmail.jp」となりますので、設定ドメインの１つとしています。- オーナー
Gmailのアカウントを持っていて、ログイン済みの場合はGmailアドレスが表示されます。
その他の人にも知らせる場合は人マークの部分にメールアドレスを入力しましょう。- reCAPTCHA 利用条件に同意する
「同意」にチェックします。- アラートをオーナーに送信する
最初からチェックボックスにチェックされています。
サイトで問題が検出された場合にアラートを受け取ります。
チェックしたままにしておくことをオススメします。- 送信
送信ボタンを押します。４、サイトキー（ site key )とシークレットキー（ secret key )を控えておく
フォームに設定したり、サイトに設定するときのために、サイトキーとシークレットキーを控えておきます。
５、控えておいたサイトキーとシークレットキーを入力
ここからはいよいよ、控えておいたサイトキー、シークレットキーの入力です。
WordPressの「お問い合わせ」＞「インテグレーション」に進みます。
「reCAPTHA」＞「インテグレーションのセットアップ」へ。
該当箇所に控えておいた「サイトキー」「シークレットキー」を入力し保存します。
お疲れ様でした。
続いて、コンバージョンの設定に進みましょう。
Googleアナリティクスでの設定もあります。
Contact Form７のコンバージョン率計測！設定方法【最新】
前提として、以前使えた、コンバージョン設定方法が、今は使えない……。
以前は、Contact Form7の「その他の設定」部分に、on_sent_okなどの Javascriptの記述を入れ、サンクスページを指定することで、コンバージョン率を測る設定ができたのですが、最新版のContact Form7では、このスクリプトはサポートされなくなりました。
注意:
on_sent_okとon_submitは Contact Form 7 5.0 で正式に削除されました。これらの設定に代えて DOM イベントを使用してください。
Contact Form７サポートページより
とはいえ、他の方法でコンバージョン設定がちゃんとできますよ。
日々のアクセスとコンバージョンを検証するためには設定は必須です！
それでは解説していきますよ〜！
１）function.phpにGoogleアナリティクスの「イベント通知処理」を記述する
設置したフォームの「送信」ボタンが押され送信完了したときに、Googleアナリティクスへ知らせるために「通知イベント」を記述します。
function.phpに直接記述しますので、あらかじめバックアップはきちんと取っておいてくださいね。
次のコードをfunction.phpにコピペしてください。
add_filter( 'wp_footer', function() {
if ( is_page() || is_single() ) {
?>
document.addEventListener( 'wpcf7mailsent', function( event ) {
gtag('event', 'Submit', {
'event_category' : 'Form',
'event_label' : 'contact'
}); }, false );
<?php
}
} );▼参考サイト（ありがとうございます！）
- フォーム送信を Google Analytics でトラッキングするもし Google Analytics を使ってサイトのトラフィックを確認しているなら、きっとコンタクトフォー…
- 【2019年版】Contact Form 7のフォームのコンバージョン率を計測する方法WordPressのお問い合わせフォーム作成プラグイン"Contact Form 7"で、お問い合わせ（送信）されることをGoogleアナリティクスの目標として設定し、コンバージョン率を計測する方法です。なお、アナリティ
function.phpの先頭行に<?phpがあることを確認してください。
ないときは（子テーマなどで新規にfunction.phpをつくる場合など）必ず追記してください。
if ( is_page() || is_single() )は、固定ページまたは投稿ページであるか、という条件判定です。
２）Googleアナリティクスで「目標」を設定
１、目標設定
２、目標の説明
「タイプ」は「イベント」を選び、続行ボタンを押します。
３、目標の詳細
function.phpに記入した通り、
- カテゴリにForm
- アクションにSubmit
- ラベルにcontact
をそれぞれ入力し、最後に「保存」ボタンを押して終了です。
これでコンバージョン率が測れるようになりました！
まとめとして
常にエラーが出ていたり警告が出ているのは嫌なものです。
Contact Form 7で警告やエラーが出ていたら要注意！
せっかくのお問い合わせが受け付けることができなくなる可能性もあります。
早めのセキュリティ＆コンバージョン率計測設定を！
カイエダからのプレゼントです▼
まずはLPについて知りたい方向けに
かっこいい「箱」をなるはやで用意する
とっととLPを作って、ビジネスを開始
