Google Analyticsでクリック数・タップ数を計測
トラッキングをする効果
なぜトラッキングをするのか。
企画の段階で、集客の全体図を描きます。
その中に「Webサイトへの流入→ゴール」のルートがあるでしょう。
もしもWebサイトへ1,000人が流入して、ゴールが10人だったら
なぜ990人がゴールできなかったのか知りたいと思いませんか？
トラッキングをすれば、その990人の行動が分かります。
たとえば「ゴール直前まで行った50人」がいたと分かっていたら、次の打ち手が変わるでしょう。
1,000→10
だけで次の企画を考えるか
1,000→100→50→10
というデータを手に入れた上で、次の企画を考えるのか。
どちらが良いかは明白。
トラッキングとは、お客様の足跡と心得ましょう。
トラッキングで計測すること
- クリックした回数
- タップした回数
これらを計測します。
「電話番号をタップしたかどうか」は、よくあるトラッキング対象です。
なぜ、企画者がトラッキングについて知るといいのか
トラッキングは、PDCAのPだからです。
つまり計画段階で決めることです。
というわけでトラッキング設計はズバリ、企画者の仕事。
トラッキングの「コード」自体は、プログラムっぽい感じがしますが「どのページで、どのように計測するか」は、プログラムとは無関係です。
そしてPDCAの「C」が、Google Analyticsでの結果確認となります。
Web制作者がテキトーに入れたトラッキング結果を、企画者がGoogle Analyticsでチェックするというのは、Pの無い「DCA」です。
計画段階で、どのように評価をするのか、あらかじめ折り込んでおきましょう。
トラッキングができる項目
nangokuでは、このように動線設定でトラッキングが可能です。
↑図のようにtrackingCodeが入力できるパーツは、トラッキング可能です。
バナーや動線などに、trackingCode欄があります。
また、通常の「テキスト」ユニットのように、aタグを書き換えられるユニットなら、トラッキング可能です。
「aタグ自体が謎」ということなら、トラッキングしたい箇所が可能かどうかWeb制作者に聞いてみましょう。
Google Analyticsでの確認方法
Google Analyticsの「イベント」ページで見られます。
どのページでクリックされやすいか、どこにある電話番号がタップされやすいかを計測できます。
もしもイベントをコンバージョンに登録していたら、コンバージョンのページでも確認できます。
トラッキングコードの入れ方
- analytics.js（〜2017年）
- gtag.js（2017年〜）
どちらのGoogle Analyticsコードを使っているかで記述が変わります。
下記でコードの入れ方を紹介しますが、ちゃんと読まなくて良いです。
3項目、欲しいデータが得られるのだな、ということだけ覚えればOKです。
実際のコード作成は、Web制作者にお願いしましょう。
ただし「どのページで、どんなデータを取りたいのか」は、企画者が決めて下さい。
analytics.js（〜2017年）の場合
ga('send','event','カテゴリ','アクション','ラベル', '値');
となります。
'カテゴリ','アクション','ラベル', '値'の4項目を指定できます。
よく使うのは値を抜いた3項目でしょう。
analytics.js（〜2017年）の設定例
| カテゴリ | 電話タップ |
|---|---|
| アクション | フッターの電話ボタン |
| ラベル | 今見ているページのURL |
onclick ="ga('send','event','電話タップ','フッターの電話ボタン','%{CURRENT_URL}', '値');"となります。
%{CURRENT_URL}というのは、今見ているページを表示してくれるa-blog cmsの「変数」です。
gtag.js（2017年〜）の設定例
onclick="gtag('event', 'アクション', {'event_category': 'カテゴリ','event_label': '%{CURRENT_URL}'});"グローバル数の{}が、文字化けすることがあります。（謎）
また、挿入箇所によっては、{}内を認識しないことがあります。
要確認。
ontouchstart スマホ向け
onmousedown PC向け
onclick レスポンシブWeb
で計測がオススメです。
aタグのtrackingCode欄に入力する場合
カスタムユニットや、各カスタムフィールドで創った入力欄を使う場合。
onclick="gtag('event', '電話タップ', {'event_category': 'カテゴリーのコードなど','event_label': ''});"
下記は、グローバル変数を使う場合。
ontouchstart="gtag('event', '電話TAP', {'event_category': 'サイト共通フッター','event_label': '%{CURRENT_URL}'});"テーマ（html）に直で書く時の例
スマホ版の右上にある電話ボタンはontouchstartで。
テーマで使う時は、バックスラッシュを使ってエスケープする。
ontouchstart="gtag('event', '電話TAP', \{'event_category': 'スマホ版ヘッダー右上','event_label': '%{CURRENT_URL}'\});"
