目次
1.はじめに
記事「Google Analyticsのトラッキングコードがグローバルサイトタグ(gtag.js)のみの表示になった」で,Google Analyticsがユニバーサルアナリティクス(analytics.js)からグローバルサイトタグ(gtag.js)に一気に移行された話をしました.ただ,これから使用を開始する場合も当分はユニバーサルアナリティクス(analytics.js)を使った方が良く,いまユニバーサルアナリティクス(analytics.js)を使っていてもグローバルサイトタグ(gtag.js)へすぐに移行する必要はないとも述べました.
とは言え,新しいものにも興味はありますし,使ってみたいとなるのも人の心と言いますか・・・(笑).そこで今回は,記事「GA(analytics.js版)でIPアドレス・クライアントID等を取得する(PHPファイル使用版)」で紹介したユニバーサルアナリティクス(analytics.js)のカスタマイズを,グローバルサイトタグ(gtag.js)で行う方法を紹介します.
注意(2021年5月追加):本サイトの記事の多くで書かれているグローバルサイトタグ「gtag.js」のGoogle Analytics(例えば,「GA(gtag.js版)」など)とは,トラッキングコードがgtag.jsで計測環境はユニバーサルアナリティクスであることに注意してください(Google Analytics 4に関係する内容では,「Google Analytics 4」や「GA4」と書きます).詳しくは記事「Google Analyticsで取得したIPアドレスのデータを見てみる」の最後の「analytics.jsとgtag.jsのGoogle Analyticsに関する補足説明」の節を参照してください.
つまり,グローバルサイトタグ(gtag.js)でカスタムディメンション機能を使い,クライアントID,IPアドレス,アクセス時間,パス,ユーザーエージェントをPHPファイルを使って取得する方法を紹介します(PHPファイルを使って取得するものはIPアドレスとアクセス時間で,他はJavaScriptのコードをカスタマイズして取得します).なお,使用するPHPファイルは,
Google AnalyticsでIPやCookieを判別できるようにする「PHPAnalyticsIP」を作った
で紹介されているものを用いています.
取得する情報のことやカスタムディメンションの設定などは,記事「GAでIPアドレス・クライアントID等を取得する(PHPファイル使用版)」を参照していください.
グローバルサイトタグ(gtag.js)で(PHPファイルを使わず・使えない環境のため)外部サーバーをつかって同様のカスタマイズをしたい場合は,記事「GA(gtag.js版)でIPアドレス・クライアントID等を取得する(外部サーバー使用版)」を参照してください.
2.トラッキングコードのカスタマイズ
では具体的なカスタマイズを紹介します.グローバルサイトタグ(gtag.js)のトラッキングコードは,
<!-- Global site tag (gtag.js) - Google Analytics --> <script async src="https://www.googletagmanager.com/gtag/js?id=UA-12345678-X"></script> <script> window.dataLayer = window.dataLayer || []; function gtag(){dataLayer.push(arguments);} gtag('js', new Date()); gtag('config', 'UA-12345678-X'); </script>
です.上記でトラッキングIDは「UA-12345678-X」と架空の値になってますので注意してください.コードを見てもらえればわかりますが,トラッキングIDが使われている箇所が2箇所あります(ユニバーサルアナリティクスでは1箇所でした)ので注意してください.
このグローバルサイトタグ(gtag.js)を記事「GA(analytics.js版)でIPアドレス・クライアントID等を取得する(PHPファイル使用版)」で紹介したものと同じデータがとれるようにカスタマイズしたユニバーサルアナリティクス(analytics.js)が下記のコードです.カスタマイズした箇所は赤字にしてあります.
<!-- Global site tag (gtag.js) - Google Analytics --> <script type="text/javascript" src="analytics.php?s=X"></script> <script async src="https://www.googletagmanager.com/gtag/js?id=UA-12345678-X"></script> <script> window.dataLayer = window.dataLayer || []; function gtag(){dataLayer.push(arguments);} gtag('js', new Date()); gtag('config', 'UA-12345678-X', { 'custom_map': { 'dimension1': 'clientId', 'dimension2': 'ip_value', 'dimension3': 'access_time', 'dimension4': 'ua', 'dimension5': 'uri_js', 'dimension6': 'id_php' }, 'access_time': setAnalytics.getAccessTime(), 'ip_value': setAnalytics.getIP(), 'ua': navigator.userAgent, 'uri_js': location.pathname, 'id_php': setAnalytics.getCookie() }); </script>
3.コードの説明
カスタマイズしたコードを簡単に説明しておきたいと思います.
まず,
<script type="text/javascript" src="analytics.php?s=X"></script>
はIPアドレスとアクセス時間などを取得するために使うPHPファイル「analytics.php」を読み込むためのコードです.これは必ずGoogle Analyticsのトラッキングコードの上に記載してください.またこの例では,サイトのhtmlファイルとPHPファイル「analytics.php」が同じディレクトリにあるときを想定した表記です.計測対象のhtmlファイルが複数のディレクトリーに分かれていて上記のコードを使う場合は,htmlファイルのあるすべてのディレクトリーにPHPファイル「analytics.php」を配置する必要があります.すべてのディレクトリー内のhtmlファイルがあるディレクトリー内にある1つのPHPファイル「analytics.php」を使う場合は,上記の「src=”analytics.php」の部分を相対パスから絶対パスに変更して使用してください.
相対パスと絶対パス
グローバルサイトタグ(gtag.js)のコードの記述はだいぶ変更になりました.カスタムディメンション関係は
Custom dimensions and metrics with gtag.js
https://developers.google.com/analytics/devguides/collection/gtagjs/custom-dims-mets
に書かれています(現在は英語のみです).
その結果,クライアントIDに関しては
'dimension1': 'clientId',
だけで,Google Analyticsのカスタムディメンションのインデックス「1」にその値を遅れるようになりました.
'ip_value': setAnalytics.getIP(),
はPHPファイル「analytics.php」を使ってIPアドレスを取得し,
'dimension2': 'ip_value',
でGoogle Analyticsのカスタムディメンションのインデックス「2」に送ります.
'access_time': setAnalytics.getAccessTime(),
はPHPファイル「analytics.php」を使ってアクセス時間を取得し,
'dimension3': 'access_time',
でGoogle Analyticsのカスタムディメンションのインデックス「3」に送ります.PHPファイルを使って時間を取得するので,サイトのあるサーバーの時計が基準で記録されます.
'ua': navigator.userAgent,
はJavaScriptで使ってユーザーエージェントを取得し,
'dimension4': 'ua',
でGoogle Analyticsのカスタムディメンションのインデックス「4」に送ります.
'uri_js': location.pathname,
はJavaScriptで使ってパスを取得し,
'dimension5': 'uri_js',
でGoogle Analyticsのカスタムディメンションのインデックス「5」に送ります.
最後に
'id_php': setAnalytics.getCookie()
はPHPファイル「analytics.php」を使ってPHPファイルが生成したクッキーを取得し,
'dimension6': 'id_php'
でGoogle Analyticsのカスタムディメンションのインデックス「6」に送ります.
ユニバーサルアナリティクスは「ga(‘set’, ・・・)」と記述していましたが,グローバルサイトタグでは「’custom_map’: {・・・}」を使います.IPアドレスやユーザーエージェントを取得するための関数を「’custom_map’: {・・・}」内の各ディメンションに記述しても動かないので上記のようになりました(ここらへんはJavaScriptに詳しい方に聞いてください.改善の余地はあるかもしれません).
4.注意
例えば,記事「GA(analytics.js版)でIPアドレス・クライアントID等を取得する(PHPファイル使用版)」のユニバーサルアナリティクスのコードを残して,新しいトラッキングIDの(カスタマイズのしていないオリジナルの)グローバルサイトタグを同一ページに追加した場合,通常の計測は問題無くできると思われます(ちゃんと確認していませんが,いろいろ試しているときそのように見えました).
ですが,カスタムディメンションで値を取得するようにカスタマイズしたユニバーサルアナリティクスとグローバルサイトタグ(使用するトラッキングIDの値はユニバーサルアナリティクスのIDと異なる)を同じページに貼ると,エラーになります.カスタムディメンションの設定がかち合います.ユニバーサルアナリティクス同士だと記事「ひとつのページで複数のGoogle Analyticsのトラッキングコードを使う方法(カスタムディメンションを用いた場合も対応)」に書いた方法で回避できますが,ユニバーサルアナリティクスとグローバルサイトタグの組み合わせでそれをどのようにやるかは現状わかりません(調べていません).
5.データ管理と利用
記事「マーケティングツールを利用規約や情報の取り扱いの重要性を理解して使用する」で書いたように取得した情報の取り扱いにも注意を払うことを忘れないようにしましょう.
IPアドレスを取得するカスタマイズを紹介していてなんですが,昨今のネットに関連する個人情報保護の動きで,取得したIPアドレスなどの情報を厳格に管理する必要が生じる場合があります.日本の現状ではIPアドレスの情報はそのような対象になっていませんが,例えばEU諸国ではGDPR(EU一般データ保護規則)によってEU諸国内の全ての個人のプライバシー保護をする必要があり,それはEUからアクセスできるサイトにも適用されます(GDPRはIPアドレスだけでなくCookieも対象なのでクライアントIDも関係します).詳しい情報は,他のサイトにお任せしますがカスタマイズによって取得したデータ管理も気をつけるべきでしょう.
なお,Google AnalyticsでもデフォルトでIPアドレスを取得していると述べましたが,Googleはそのデータを匿名化するための情報を提示しています.
アナリティクスでの IP 匿名化(IP マスキング)
アナリティクスでの IP アドレスの匿名化の方法に関する技術的な説明
取得したIPアドレスに関して,本サイトでは記事「IPアドレスの情報を利用してビジネスチャンスを広げる – 無料で出来そうなこととは?-」で利用方法なども考えていますが,カスタマイズやその取得したデータの取り扱いは自己責任でお願いします.
補足
その他のGoogleアナリティクスのカスタマイズ関連の記事はカテゴリー「GAのカスタマイズ」を参照していください.例えば,下記のような記事があります.
GA(analytics.js版)でクライアントID・アクセス時間等を取得する(JavaScriptのみ版)
GA(gtag.js版)でクライアントID・アクセス時間等を取得する(JavaScriptのみ版)
設定関係で以下のような記事もあります.
Google Analytics(analytics.js版)でURLが変わらないサイトを仮想ページで計測する
Google Analytics(analytics.js版)でのファイルダウンロードを計測するための設定
参考
Web制作者がgtag.jsで知っておきたいGoogleアナリティクスの今
<この記事は「デジマのあれこれ」にて2017年11月頃公開された記事を一部改良して移植したものです>