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

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

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

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

このコードは <head> タグの先頭付近で、他のスクリプトや CSS タグの前に追加してください。また、文字列 '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 つです。

analytics.js JavaScript ライブラリを https://www.google-analytics.com/analytics.js から非同期的にダウンロードする <script> 要素を作成します。
グローバル ga 関数（ga() コマンドキュー）を初期化します。analytics.js ライブラリが読み込まれ、準備が完了した段階でコマンドが実行されるようスケジュール設定できます。
'UA-XXXXX-Y' パラメータで指定したプロパティに新しいトラッカーオブジェクトを作成するコマンドを ga() コマンドキューに追加します。
現在のページのページビューを 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 の仕組みを説明します。

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

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

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

次のステップ

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

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

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