【解決済み】Googleアナリティクスでイベントトラッキングを設定。なぜか反映されなかった(T_T)

グーグルアナリティクスでイベントトラッキングの設定方法と恥ずかしながら2時間ハマってしまった原因

だいぶブログ更新があいてしましました^^;
これからはもっと更新頻度を上げていきたい…。

さて、サイト運営をしている方は必ずと言っていいほどGoogleAnalytics(グーグルアナリティクス)を設置しアクセス数や資料請求、問い合わせフォーム送信のコンバージョン数を確認していると思います。

今回は、クライアントから「電話番号をタップした回数を計測したい」との要望があり、aタグにイベントトラッキングの設定を行うことにしました。電話本数を計測したいとのことでしたが、これはあくまでも

<a href=”tel:0300000000″>03-0000-0000</a>

をタップした回数です。もちろん、その後電話を掛けない場合もあるので電話本数とイコールではありませんが、ユーザー行動の目安にはなりそうです。

すでにアクセス計測の為、全ページにトラッキングコードを設置済み。
設置したトラッキングコードは最近開設したサイトなのでグローバルサイトタグ(gtag.js)です。

<!– Global site tag (gtag.js) – Google Analytics –>
<script async src=”https://www.googletagmanager.com/gtag/js?id=UA-00000000-0″></script>
<script>
window.dataLayer = window.dataLayer || [];
function gtag(){dataLayer.push(arguments);}
gtag(‘js’, new Date());
gtag(‘config’, ‘UA-00000000-0’);
</script>

あとはアナリティクス画面で「目標」の設定を行い、HTML内のaタグ部分に　javascriptタグを入れれば設定完了！

①アナリティクス「管理」で「目標」で「+新しい目標」を設定する。

管理から赤枠「目標」に入り、「+新しい目標」ボタンをクリックする。

②「目標設定」「目標の説明」「目標の詳細」を入力する。

目標設定では「カスタム」を選択。

目標の説明では任意の「名前」を入力して、タイプはイベントを選択する。

目標の詳細は、カテゴリとアクションは必須項目、ラベルはバナーの位置などで複数分けて計測したい場合に便利。

ここでは

【カテゴリ】phone
【アクション】tap
【ラベル】banner

としました。「値」は、そのアクションに対しての値段付けというべきでしょうか？単純に1と入力する方もいらっしゃるようですが、今回は設定しません。

③HTML内のイベントトラッキングを設定したい場所にjavascriptのタグを設置する。

イベントトラッキングを計測したい場所(aタグ)内に、タグを設置します。

<a href=”tel:0300000000″ onclick=”gtag(‘event’, ‘tap’, {‘event_category’: ‘phone’,’event_label’: ‘banner’});” >03-0000-0000</a>

となります。

④反映するかどうか、アナリティクス管理画面のリアルタイム表示で確認する。

問題がなければ、アナリティクス管理画面のリアルタイム表示でイベントの確認が取れます。

イベントトラッキングを設置したけど反映されなかった件

上記の通り行えば、10分程度で終わる作業なのですが、実はちょっとハマってしまいまして2時間位かかってしまったので、ちゃんと備忘録として記録しておこうかなと思いました。これをきっかけに自身の備忘録、アウトプット用としてちゃんとブログを更新していこうと思います。

なぜ反映しなかったいうと、過去にも他サイトでイベントトラッキング計測を行っていましたが、aタグに設置するタグをその時と同じ書き方で設置してしまっていたからです。

<a href=”tel:0300000000″ onclick=”ga(‘send’,’event’,’phone’,’tap’,’banner’);” >03-0000-0000</a>

これ、最初はスペルミスとかアナリティクス管理画面での設定ミスかと思い、何度も確認しましたが問題無し。

「イベントトラッキング　設定」などでググってみても上記の設定タグが出てくる。

なぜ？

と、再度「イベントトラッキング　反映されない」でググってみると結構同じ理由でハマってしまっていた人がいた模様。

下記サイト参考にさせていただきました。ありがとうございます。

アナリティクス gtag.js でイベント設定具体例

以前までのトラッキングタグ analytics.js と今回設定した gtag.js でイベントトラッキングの取り方(書き方)が変わっていた模様。

最初に設定していた、ga (‘send’,～ のタグはanalytics.js での設定方法との事。これから新たにトラッキングタグを設置する場合はgtag.jsなので、上記で説明した設定で行えばOK。