【初心者向け】Google Analyticsのイベントトラッキングでボタン遷移数を計測

サイトのアクセスを解析をするなら断然使いたいGoogle Analyticsですが、最近よく聞かれることが多いので一度、「イベントトラッキング」についてまとめてみようと思います。
Google Analyticsにもコードにも慣れていないという初心者向けにわかりやすく書いていこうと思います。(私もそうだったので！)
ちなみに、今回はユニバーサルアナリティクス向けのイベントトラッキング計測になります。

イベントトラッキングのコード

まず、結論からサクッと書いてみましょう。計測したいバナーやリンクに貼るトラッキングコードは下記です。

<a href="ここにはURL" onclick="ga('send','event','banner','click','side',500);">ここがアンカー</a>

【send】必須：ここは必ず「send」です。
【event】必須：ここは必ず「event」です。
【banner】必須：どこを計測するかというカテゴリです。自由につけられます。
【click】必須：どんな動きを計測するかというアクションを入れます。自由につけられます。
【side】任意：複数のバナーなどで計測する時の目印(ラベル)です。自由につけられます。
【500】任意：この1回の動きでどれくらいの数値が発生するかを入れられます。自由に数字をいれられます。

では、もっと詳しく解説をしていきましょう！

ユーザーの動きを数値化するイベントトラッキング

そもそもイベントトラッキングはどんなときに使えるものなのでしょうか？

例えば、「資料請求の問い合わせボタンを作ったけど、どれくらい押されてるの？」「電話で予約するボタンを作ったんだけど、ほんとにみんなこのボタン使ってくれてるのかな？」といったような時にこのイベントトラッキングは活用できます。

このようなバナーなどですね！
このようにリンクが付いている箇所に上にも書いたような、「ga」から始まるコードを「onclick」というJavaScriptを使用して設置してあげることで、Google Analyticsにデータを送信するという仕組みです。

<a href="ここにはURL" onclick="ga('send','event','banner','click','side',500);">ここがアンカー</a>

こちらがコードを入れた状態のリンク。赤文字になっている部分が今回入れるトラッキングコードです。各意味を持った指示を「'(シングルクォーテーション)」で囲み、「,(カンマ)」で区切って記述をしていきます。これらは全て半角ですよ！それでは指示を1個ずつ詳しく解説をしていきましょう。

【send】【event】
この2つは必須の記述です。また、ここは絶対にこの記述です。「イベントをAnalyticsに情報としてに送りますね～」という記述です。

【banner】
この部分はカテゴリと呼ばれる部分で、今回はbannerとしていますが好きなカテゴリ名を入れることが出来ます。こちらも必須記述。これで「どんなイベントを取得しているのか」というタイトルをつけて上げる感じです。今回はバナーリンクを例に出したので、bannerです。

【click】
この部分はアクションと呼ばれる部分です。こちらも必須記述。どんな動きを計測するかをわけてあげるための部分です。今回はリンクを「クリック」した人を計測するのでclickにしています。こちらも好きな記述が可能です。

【side】

ここはラベルと呼ばれる部分で、任意で付けることが出来ます。なので、必ず付けないといけないわけではありません。例えば、「同じ資料請求だけど、赤色と青色どっちがたくさんクリックされてるか調べたい！」というときにはこのラベルを使って「赤」と「青」のコードをわけてあげれば、「カテゴリとアクション」で総数を確認しつつ、「赤」と「青」の数値も分けて計測できる、というすぐれものです。今回はsideとしてみました。

【500】
ここは値を入れる部分で、数字を入れます。任意なので必須ではありません。この部分で記述された数字は「1回のイベントで発生する値」の数値です。
例えば、1回の資料請求で500円の売上が発生する、と言った場合は500を入れておけば、クリックされた数だけ数値も計算される仕組みです。