Google Tag Managerで、Contact Form 7の送信数を計測する方法
最近は、Google Analytics(以下GA)のトラッキングコードなどをGoogle Tag Manager(以下GTM)で管理するケースが多くなってきました。今回は、wordpressの定番メールフォームプラグインである「contact form 7（以下CF7）」の送信数をGTM+GAで計測する方法を紹介します。
目次
1.GTMとGAの導入
事前準備としてGTMをサイトにインストールしてGAタグを導入します。
1-1.サイトへGTMをインストール
GTMにログインして、アカウントを作成。新しいコンテナを作成して、「管理」メニューからインストール用のコードを確認し、サイトのhead内およびbodyタグ直下にコピペします。これで、とりあえずサイトへのGTM導入は完了です。
1-2.GTMにGA計測タグを設置
GTMの管理画面から、コンテナに「新しいタグを追加」します。
- サイドバーの「タグ」をクリック。
- 「新規」をクリック。
- タグタイプの選択で「ユニバーサルアナリティクス」を選択。
- トラッキングIDを入力。
- トラッキングタイプは「ページビュー」を選択。
- トリガーは「All Pages」を選択。
- 名前を入力して「保存」をクリック。
これで、ひとまずすべてのページのアクセスが計測されるようになります。１番シンプルなGTM+GA導入のカタチですね。
2.CF7の計測
CF7からメールが送信されたときに計測できるよう準備します。
2-1.フォーム識別用の変数を作成
サイト内に複数のフォームがある場合、どのフォームから送信されたのかを判別するために、GTMの「ユーザー定義変数」を使用します。フォームがひとつしかないサイトでも、将来的に増える可能性がありますから、あらかじめ設定しておくと良いでしょう。
- サイドバーの「変数」をクリック。
- ユーザー定義変数のところにある「新規」をクリック。
- 名前を入力。今回は「フォーム名」としておきます。
- 変数タイプは「データレイヤーの変数」を選択。
- データレイヤーの変数名を入力。今回は「formName」としておきます。
- 「保存」をクリック。
これで変数が作成されました。フォーム送信時に、このデータレイヤー変数にフォーム識別用の値を入れることで、どのフォームから送信されたか判定できます。
2-2.フォーム送信用のトリガーを追加
- サイドバーの「トリガー」をクリック。
- 「新規」をクリック。
- 名前を入力。今回は「wpcf7送信」としておきます。
- トリガーのタイプは「カスタムイベント」を選択
- イベント名を入力。今回は「wpcf7」としておきます。
- 「保存」をクリック。
2-3.フォーム送信用のタグを追加
- サイドバーの「タグ」をクリック。
- 「新規」をクリック。
- 名前は「フォーム送信」とでもしておきましょう。
- タグタイプは「ユニバーサルアナリティクス」を選択。
- トラッキングIDを入力。
- トラッキングタイプは「イベント」を選択。
- カテゴリを入力。今回は「wpcf7」としておきます。
- アクションを入力。今回は「submit」としておきます。
- ラベルは入力欄横の＋ボタンをクリックして、先ほど作成したフォーム識別用の変数を指定。「{{フォーム名}}」と入力されるはずです。
- トリガーは先ほど作成したカスタムイベント「wpcf7送信」を選択。
- 「保存」をクリック
2-4.CF7側の設定
CF7の管理画面で「その他の設定」に以下を記述。
on_sent_ok: "dataLayer.push({'event’:’wpcf7’,’formName’:’【フォーム識別名】’});"
これで、メールフォームから送信されたときにトリガーの条件となる「wpcf7送信」イベントが発動するようになります。フォーム識別名は、ラベルとして使用されます。
3.GAのコンバージョン設定
GA上からメール送信数をコンバージョン数としてカウントできるようにします。
GAの管理画面の「アナリティクス設定」から「目標」を設定します。
目標のタイプを「イベント」にして、目標の詳細のイベント条件で、カテゴリ、アクション、ラベルを設定します。カテゴリ、アクションは、GTMタグで指定したものを（今回は「wpcf7」と「submit」）。ラベルには、CF7のon_sent_okの箇所で指定した【フォーム識別名】を入力します。
完成
以上で完了です！
テスト送信して、GAのリアルタイムレポートで正常にカウントできているか確認してください。
余談
Google Tag ManagerとGoogle AnalyticsとContact Form 7の組み合わせは、wordpressでサイトを制作した際のメジャーな組み合わせのひとつですが、なかなかネット上に分かりやすい記事がないため、私もはじめてのときは苦労しました。私と同じ絶望を味わうことなく、ストレスフリーなGTMライフを送っていただけたら嬉しいです！