更新(2019/9/17)
コメント欄に助言をいただいたので、タグをもう少し高度に&記述も追加してみた。(@hareno 様ありがとうございました。)
はじめに
Google Analytics (以下GA)を設置しているサイトで外部サイトリンクのクリック数(外部リンククリックイベント)を計測するニーズがあり、できるだけ手っ取り早く導入できる方法を検討した。
目的
運営しているサイトに新しく追加する外部サイトへのリンクのクリック数を計測したい
前提条件・制約
- GAoogle Analyticsのタグは設置済み
- 自分で管理している以外のGAタグも設置されている
- とりあえずお試しでリンクの効果測定
- 今後大量のリンクを置いたりそれを効果測定したりする見込みはない
- 運営者がコロコロ変わるのであまり難しいことはできない(特にGAは操作方法が分かっていないメンバーが多いため、できるだけjavascriptだけで設定したい)
これらの条件から、タグマネージャを導入するのではなく単発のイベント発火を仕込むことにした。
グローバルタグについて
入っている前提なので設置方法は省略。
GAタグの種類
Google Analytics のタグは複数の種類がある。
- グローバル サイトタグ(gtag.js) ←最新機能が入っているタグ。ウチはこれ。
- analytics.js ←以前使われていたタグ。継続使用もできるが最新機能は使えない?
- その他 ←タグマネージャのタグを入れるとかいろいろあるらしい。よく知らない。
複数タグを埋め込む場合
お上から押し付けられたタグと自分で管理しているGAのタグが共存してるけど、今のところ目立った問題はない。
少なくとも自分で管理しているタグはログが取れている。
リンクにタグを埋め込む
以下はGoogle公式ドキュメントを元に、自分なりにまとめなおしたもの。
イベント送信の構文
gtag('event', <action>, {
'event_category': <category>,
'event_label': <label>,
'value': <value>,
'send_to': <trackingID>
});
引数
<xxx>
は引数。action
は必須、その他は任意だそうな。
また、action
, category
, label
にはデフォルトで仕様を推奨された文字列がある。
イベント間の命名の一貫性を確保できる他、将来的な機能追加の際に便利になるんだとか(何が来るか楽しみ)。
デフォルトのイベントの一覧もあるのだが、 このページ と このページ でリストの中身が若干違う(執筆時)。eコマースに寄った項目が多く、外部サイトリンククリックは当てはまるものがない?
さらにリンクを辿ると イベントの要素の詳細 が書かれているページがあった。
(余談だが、構文上はアクション→カテゴリ→ラベルの順で登場するのにドキュメントではカテゴリ→アクション→ラベルの順になってるのでやや混乱した)
(2019/9/17追記)
さらに、gtag.js パラメータ リファレンスによると、gtag()
event
に渡すことができるパラメータにsend_to
というのがあり、これを指定することで自分の管理しているGAにのみイベントを送信できるとのこと。お上のGAに自分のGAのイベントが紛れ込んだら何を言われるか分からないのでありがたく設定しておく。
なおここで渡すのは「トラッキングID」(管理>プロパティ>トラッキング情報>トラッキングコード にある)というやつ。
ということで、最終的に下記の値を渡すことにした。
- カテゴリ : link
- アクション : click
- ラベル : リンクURL
- トラッキングID:自分のGAのトラッキングID
完成形
ここまでで組み立てたイベント送信コマンドをリンクのOnClick
に仕込む。改行は邪魔なので削除しておく。
<a href="https://xxx", OnClick="gtag('event', 'click', {'event_category':'link','event_label':'https://xxx', 'send_to':'xx-xxxxxxxxx-x'});" target="_blank">リンク文字列</a>
(外部リンクなので新タブで開くおせっかいを追加)
結果確認
Analyticsのリアルタイム→イベントを開くとイベントが取れているか確認できる。
レポート画面は省略するが無事取得できていた。
(2019/9/17追記)
send_to
追加後もイベントはきちんととれている。一度間違えてアナリティクスアカウントの名前の方を入れてしまい取得できなかったので、むしろきちんと送り分けられていることが判明した。
スクリプトの前後関係
ちなみに、このページ に
gtag()
コマンドは、グローバル スニペットがページのgtag()
コマンドが呼び出されるより前にない限り、データを送信できません。
とあり、グローバルスニペット=グローバルサイトタグだと思うが、~~ウチではイベント送信が先でもログ取得できていた。~~ソース上の前後ではなく呼び出しの前後ということのようで、ページ読み込み時にソース下部のスクリプトでグローバルスニペットが設定される → ボタン押下時にイベントが発火してデータ送信される の順で動いているので問題ない模様。
(同じ結果でも理由が分かっていないのと分かっているのとでは安心感が違いますね……@hareno様ありがとうございます)