今回は、フォーム送信完了をGoogleタグマネージャで計測する方法をご紹介します。
フォームは「Contact Form 7」で作成している場合に限ります。最近こちらのWordpressプラグインでお問合せフォームを作成しているサイト増えていますね。
最終的にGoogleアナリティクスで計測した送信完了を目標設定まですると、アクセス分析しやすくなります。
[aside type="normal"]以下
Google Tag Manager : GTM
Google Analytics : GA[/aside]
実現できること
「Contact Form 7」で作成したお問合せのフォームの送信完了をGoogleアナリティクスのイベントとして計測します。
目標設定することで、コンバージョンとしてもカウント可能です。
Googleタグマネージャにログイン
まずは、GTMにログインします。
権限がない場合には管理者にご連絡ください。
別の人にお願いする場合には、Googleアカウントを聞いて権限を付与してください。
前提条件
[ul]Googleタグマネージャがサイトに設置されている
Googleアナリティクスでアクセス数が計測できている
サイトをWordpressで構築
Wordpressのプラグインの「Contact Form 7」のお問合せ完了を計測したい
以前の「on_sent_ok:」は現在非推奨。利用できなくなる予定
[/ul]
イベント発生用スクリプトのタグ作成
フォーム送信完了時にカスタムイベントが発生するように、「Contact Form 7」指定のスクリプトを設置します。
ここでは、トリガー(配信ページ)は、すべてのページとします。
タグ:カスタムHTML
トリガー:All Pages (すべてのページ)
document.addEventListener( 'wpcf7mailsent', function( event ) { dataLayer.push({'event' : 'wpcf7successfulsubmit'}); }, false );
トリガーの作成
上記の設定で、カスタムイベント「wpcf7successfulsubmit」が発生するようになりますので、それを検出するためのトリガーを作成します。
ここでは名前は「イベント:wpcf7successfulsubmit」とします。
Googleアナリティクス イベントタグの作成
作成したトリガーを条件として、配信するGAのイベントタグを作成します。
トリガーは、上記の「イベント:wpcf7successfulsubmit」を紐づけます。
タグ:ユニバーサルアナリティクス
トリガー:イベント:wpcf7successfulsubmit
ここでは、Googleアナリティクス設定の部分は、変数の「Googleアナリティクス設定」を使用しています。
公式ヘルプ Google アナリティクス - タグマネージャ ヘルプ
support.google.com/tagmanager/answer/6107124?hl=ja#tags
GTMのプレビューモードで動作確認
GTMのプレビューモードで動作確認します。
画面右上のプレビューを押します。
Googleアナリティクス 計測確認
GAにログインします。GAのリアルタイムレポートのイベントでお問合せイベントが発生していることを確認します。
発生してればOKです。
Googleタグマネージャを公開
作成したGTMの変更を本番環境に反映します。
Googleアナリティクス 目標設定
必要に応じて、目標設定も忘れずに行ってください。
基本的な目標設定ですので、ここでは割愛します。
おまけ:タグマネージャを使わずに、アナリティクスのみで計測する場合
ヘッダー
内に次のスクリプトを記述して、送信完了を検知して、Googleアナリティクスにイベントデータを飛ばします。設定箇所は、コンタクトフォームのその他設定ではありません。
<script> document.addEventListener( 'wpcf7mailsent', function( event ) { ga('send', { hitType: 'event', eventCategory: '<カテゴリに計測したい文字列>', eventAction: '<カテゴリに計測したい文字列>'}); }, false ); </script>
参考
フォーム送信を Google Analytics でトラッキングする | Contact Form 7 [日本語]
contactform7.com/ja/tracking-form-submissions-with-google-analytics/
不明点ありましたら、ココナラ(スキル売買サービス)でお手伝い活動もしていますので
お気軽にご相談してください。
Googleアナリティクスのお手伝いメニュー | ココナラ
coconala.com/users/156256
告知:スクロール計測の新しい手順作成しました!
[kanren postid="3632"]