フォーム送信を Google Analytics でトラッキングする

もし Google Analytics でサイトのトラフィックを解析しているなら、コンタクトフォームの送信もトラッキングしたいでしょう。この記事では Google Analytics を使って Contact Form 7 のフォーム送信をトラッキングする簡単な方法を紹介します。

この記事で用いられている JavaScript のコードは、記事が書かれている時点で最新の Google Analytics ライブラリ (analytics.js) に基づいたものです。旧式のライブラリ (ga.js) を使用している場合は、Google のガイドに従って文中の JavaScript を置き換える必要があります。

まず最初に、あなたのサイトの HTML ソースを見て、そこに以下のようなコードがあることを確認してください:

<!-- Google Analytics -->
<script>
(function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
(i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
})(window,document,'script','//www.google-analytics.com/analytics.js','ga');

ga('create', 'UA-XXXXX-Y', 'auto');
ga('send', 'pageview');
</script>
<!-- End Google Analytics -->

もしない場合は Google Analytics の基本的なページトラッキングコードがまだインストールされていませんので、それを済ませてから次に進んでください。

イベントトラッキング

Contact Form 7 の AJAX フォーム送信はイベントとしてトラッキングできます。次の JavaScript 関数呼び出しにより、Google Analytics にコンタクトフォーム送信のイベントを送ることができます:

ga('send', 'event', 'Contact Form', 'submit');

このコードを走らせるために JavaScript のファイルを書き換える必要はありません。次の節で説明する on_sent_ok アクションフックを利用できるからです。

on_sent_ok を利用する

Contact Form 7 は “on_sent_ok” と呼ばれる JavaScript のアクションフックを用意しており、それによってフォーム送信完了後に実行したい JavaScript の関数を指定できます。

上記のイベントトラッキングコードをこのフックにセットするには、コンタクトフォーム編集画面のその他の設定タブに次の行を挿入します:

on_sent_ok: "ga('send', 'event', 'Contact Form', 'submit');"

コードを引用符で囲むのを忘れないでください。また、必ずすべてが一行に収まるようにしてください。

以上です。これで、もしすべて正しく設定が済んでいるなら、Google Analytics はコンタクトフォームを経由した正常なフォーム送信を、イベントカテゴリーが “Contact Form”、イベントアクションが “submit” のイベントとしてトラッキングするでしょう。

これが正しく機能していることを確認するには、フォーム送信があった 24-48 時間後に Google Analytics の行動 > イベント > サマリーページをチェックしてください。そこにトラッキングされたイベントが見つかるはずです。

WordPress のお問い合わせフォームプラグイン。シンプル、でも柔軟。