前提としてですが、通常のGoogleアナリティクスのトラッキングコードがAMP（Accelerated Mobile Pages Project）ページにあるとエラーが出てしまいます。（エラーは出るけど、計測はできるみたいです。2016/02/26確認時点）
エラーがある（AMPページがGoogleのガイドラインに準拠していない）ページは、Google検索のAMP関連機能に表示されないです。
そこで、AMPページをGoogleアナリティクスで計測する方法がありますので「AMPページもGoogleアナリティクスで計測したい」という場合はご参考ください。
対応についてはAMPのドキュメント「amp-analytics.md」を参考にしましたが、Googleアナリティクスのドキュメント「Adding Analytics to your AMP pages」は端的に書かれているので、理解しやすいです。
ということで、さっそくやってみましょう！
ライブラリを読み込もう
まずはじめに、AMPページをGoogleアナリティクスで計測するための専用のライブラリがありますので、以下のスクリプトを「<head></head>」内に読み込みましょう。
<script async custom-element="amp-analytics" src="https://cdn.ampproject.org/v0/amp-analytics-0.1.js"></script>
読み込み順はAMPのドキュメント「amp-html-format.md」を参考にして「<meta charset=”utf-8″>」以降に読み込み「<style amp-boilerplate>」の前に読み込みました。
計測用のコードを書こう
スクリプトを読み込んだら、次は「amp-analytics」というAMP専用の要素を使って計測用のコードを書きます。いろいろと書き方があるんですが、まずは基本として以下のようなコードを書いてページトラッキングしてみましょう。
シンプルな書き方でまずは感覚を掴んだほうが、その後の理解も進み応用もしやすいと思います。
計測用のコード（例）
<amp-analytics type="googleanalytics">
<script type="application/json">
{
"vars": {
"account": "UA-XXXXX-Y" // GoogleアナリティクスのトラッキングIDを入れる
},
"triggers": {
"trackPageview": { // 任意の文字列を入れる「trackPageview」じゃなくてもOK
"on": "visible", //ページが表示されたら
"request": "pageview" //ページトラッキング
}
}
}
</script>
</amp-analytics>補足としてコード内にコメントを書きましたが、少しだけ「ここは気を付けておこう」と思うことがありました。
type属性に注目しよう
amp-analyticsに設定する属性「type」には、計測したいベンダーを入れます。計測できるベンダーとして「Adobe Analytics」や「Chartbeat」などもあります。詳細はAMPのドキュメント「amp-analytics.md」でご確認ください。
<amp-analytics type="googleanalytics">
今回はGoogleアナリティクスを利用するので「googleanalytics」を設定します。
トラッキングIDについて
コード中にはGoogleアナリティクスのトラッキングIDを入れる箇所があります。
"account": "UA-XXXXX-Y" // GoogleアナリティクスのトラッキングIDを入れる
トラッキングIDを確認する方法は以下のページに書きましたので、確認方法がわからない場合はご参考ください。
コードを追加する場所はここ
コードは「<body></body>」内に追加しましょう。私は「</body>」の直前に追加しました。
・・・と、以上のことはコードを書く際には気を付けたいです。コードを書いたら、次はGoogleアナリティクスで計測してみましょう。
Googleアナリティクスで計測してみよう
AMPページにアクセスして、Googleアナリティクスで計測されているかどうかを確認します。
今回はページトラッキングができるコードを書いたので、例えばGoogleアナリティクスのリアルタイムのサマリーを見ると、アクティブなページの一覧にAMPページが入っています。
うまく計測されていますね。
AMPページと通常ページの計測結果を見分けるため、計測上でのページタイトルを変更することもできます。タイトルの後ろに「AMP_html」などを付ける、とか。
例えばGoogleアナリティクスAPIでタイトルに紐づいたデータを扱う場合は、AMPページと通常ページは分けておきたい、とか考えることもあると思います。
このタイトルを変更する方法はGoogleアナリティクスのドキュメント「Adding Analytics to your AMP pages」がわかりやすいです。
まとめ
AMPページをGoogleアナリティクスで計測する方法について書きました。今回はその基本としてページトラッキングに焦点をあてましたが、イベントトラッキングやカスタムディメンションなどの設定もできます。
詳しくはAMPのドキュメント「amp-analytics.md」とGoogleアナリティクスのドキュメント「Adding Analytics to your AMP pages」をご参考ください。（私も勉強中なので、少しずつやり方を覚えています）
これからAMP対応される方で、Googleアナリティクスで計測される方などいらっしゃいましたら、ご参考くださいますと嬉しいです。
WordPressのAMPプラグインをご使用の方はこの方法でもOK
WordPressのAMPプラグインをご使用の方は、フックを使うと同様のことができます。以下のページに書きましたのでご参考ください。
このページを共有する