サイトに analytics.js を追加する

analytics.js ライブラリは、ユーザーとウェブサイトの接点を測定する JavaScript ライブラリです。このドキュメントでは、サイトに analytics.js を追加する方法について説明します。

JavaScript トラッキング スニペット

analytics.js の使用を開始するには、次のコード(「JavaScript トラッキング スニペット」)をサイトのテンプレートに追加するのが最も簡単です。

このコードは、終了タグ </head> より前に追加し、文字列「UA-XXXXX-Y」はトラッキング対象の Google アナリティクス プロパティのプロパティ ID(「トラッキング ID」)で置き換えてください。

<!-- Google Analytics -->
<script>
(function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
(i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
})(window,document,'script','https://www.google-analytics.com/analytics.js','ga');

ga('create', 'UA-XXXXX-Y', 'auto');
ga('send', 'pageview');
</script>
<!-- End Google Analytics -->

上のコードで行われる主な処理は次の 4 つです。

  1. https://www.google-analytics.com/analytics.js から analytics.js JavaScript ライブラリを非同期的にダウンロードする <script> 要素を作成します。
  2. グローバル ga 関数(ga() コマンドキュー)を初期化します。analytics.js ライブラリが読み込まれ、準備が完了すると、実行するコマンドをスケジュール設定できます。
  3. UA-XXXXX-Y」パラメータで指定したプロパティに新しいトラッカー オブジェクトを作成するコマンドを ga() コマンドキューに追加します。
  4. 現在のページのページビューを Google アナリティクスに送信する別のコマンドを ga() コマンドキューに追加します。

実装をカスタマイズする場合は、JavaScript トラッキング スニペットの最後の 2 行(create コマンドと send コマンド)を変更するか、より多くの接点をトラッキングするためにコードを追加することが必要になる場合があります。ただし、analytics.js ライブラリを読み込むコードや、ga() コマンドキュー関数を初期化するコードは変更しないでください。

代替の非同期トラッキング スニペット

上記の JavaScript トラッキング スニペットにより、すべてのブラウザでスクリプトが確実に読み込まれ、非同期的に実行されますが、最新のブラウザでは、スクリプトをプリロードできないという欠点があります。

この問題の対策として、次のような代替の非同期トラッキング スニペットを使用することで、最新ブラウザでのパフォーマンスをわずかに向上させることができます。ただし、IE 9 や古いモバイル ブラウザでは async 属性が認識されないため、読み込みと実行が同期的に行われる可能性があります。このため、ユーザーが主に最新のブラウザを使用してサイトにアクセスする場合にのみ、このトラッキング スニペットを使用することをおすすめします。

<!-- Google Analytics -->
<script>
window.ga=window.ga||function(){(ga.q=ga.q||[]).push(arguments)};ga.l=+new Date;
ga('create', 'UA-XXXXX-Y', 'auto');
ga('send', 'pageview');
</script>
<script async src='https://www.google-analytics.com/analytics.js'></script>
<!-- End Google Analytics -->

トラッキング スニペットで取得されるデータ

上記のいずれかのトラッキング スニペットをウェブサイトに追加する際は、ユーザーが訪問する各ページでページビューを送信します。このデータは Google アナリティクスで処理され、次のような多数のデータを推定できます。

  • ユーザーがサイトに滞在した合計時間
  • 各ページでのユーザーの滞在時間および訪問したページの順番
  • クリックされた内部リンク(次のページビューの URL に基づく)

また、新しいトラッカーを作成する際に analytics.js によって確認される IP アドレス、ユーザー エージェント文字列、最初のページは、次のようなデータを取得するために使用されます。

  • ユーザーの地域
  • 使用されているブラウザとオペレーティング システム
  • 画面サイズ、Flash や Java のインストール有無
  • 参照元サイト

次のステップ

基本的なレポートであれば、JavaScript トラッキング スニペットで収集されるデータで十分ですが、ユーザーに関する追加の情報が必要になる状況も数多くあります。

このサイトのガイドでは、analytics.js を使用して対象となる接点をトラッキングする方法を説明していますが、いずれかの機能を実装する際は、事前に左側のナビゲーションの「基本」で示されているガイドを確認することをおすすめします。各ガイドには、analytics.js ライブラリの概要が説明されており、サイト内で使用されているコードサンプルをより深く理解するために活用できます。

このシリーズの次のガイドでは、analytics.js の仕組みを説明します。