タグの入れ替えで予期せぬ失敗!?
2014年4月にGoogle アナリティクスからの完全移行がリリースされ、段々と各社でユニバーサル アナリティクスへの移行が始まって来た頃ですね。「Google アナリティクスタグを差し替えなきゃいけない」、「管理画面はどう変わるの」と言う方もいらっしゃることと思います。
今回のテーマは「ユニバーサル アナリティクスタグのトラッキングコード」です。どの様なタグ設定にすれば良いのか、基本的な部分をお伝えします。
ユニバーサル アナリティクスに移行することで計測の幅が広がる一方で、単純にタグを入れ替えただけではその記述や管理画面での設定に不足が生じる可能性があり、注意が必要です。予期せぬ失敗を起こさないためには、仕様の変更についてチェックしましょう。
目次
「5 STEPS」でユニバーサル アナリティクスへ移行
まずは、簡易的な移行の手順をご案内します。
STEP1
Google アナリティクス管理画面のアナリティクス設定のプロパティ欄から移行開始ボタンをクリックします。
(強制移行されていないプロパティのみ。下(図1)では既に移行されています)
STEP2
アナリティクス設定のプロパティ欄の「移行が完了しました」と言うメッセージを待ってから、Google アナリティクスタグをユニバーサル アナリティクスタグに差し替えます。
(タグはトラッキング情報>トラッキング コードにありますが、必要に応じてカスタマイズを行います)
STEP3
Google アナリティクスにてカスタム変数を使用している場合は、カスタムディメンションに移行します。
(但し、過去情報の引き継ぎはできないため、新たに用意する形となります)
STEP4
プロパティ設定から「ユーザー属性とインタレスト カテゴリに関するレポートの有効化」及び「拡張リンク アトリビューションを使用する」をオンにします。
(オフになっていた場合)
STEP5
トラッキング情報>参照元除外リストから、計測対象サイトと相互でリンクを貼っていて、ユニバーサル アナリティクスタグが貼られていないサイトを登録します(※1)。
(※1)ユニバーサル アナリティクスでは、セッション定義の仕様変更により、計測対象サイトから外部サイトへ離脱し、リンクを踏んで計測対象サイトに戻って来ると、新セッションが始まります。従って、今までGoogle アナリティクスでは計測が上がらなかった外部サイト流入が増える可能性があり、相互リンクを貼っていて関係性が深いがユニバーサル アナリティクスタグを埋めていない外部サイトに関しては、登録した方が良い場合があります。
デフォルトのトラッキングコードをカスタマイズ
さて、ようやくトラッキングコードの中身ですが、ユニバーサル アナリティクスの管理画面(Google アナリティクスの管理画面と変わりありません)から取得できるのは、【例1】のような最低限のものとなります。
【例1】
<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’,’//www.google-analytics.com/analytics.js’,’ga’);
ga(‘create’, ‘UA-XXXX-Y’, ‘auto’);
ga(‘send’, ‘pageview’);
</script>
例えば、下の5種類の機能を使用する場合は、【例1】のコードにトラッキングコードを追加しなければなりません。
機能1:サブドメインまたぎ(abc.medix-inc.co.jpとxyz.medix-inc.co.jp間のような)
機能2:別ドメインまたぎ(medix-inc.co.jpとmedix-jirei.com間のような)
機能3:eコマース(旧式のeコマースと拡張eコマースがあります)
機能4:ディスプレイ広告対応(リマーケティングや訪問者の属性情報取得に利用)
機能5:拡張リンクのアトリビューション(ページのクリック箇所の計測)
機能1:サブドメインまたぎ(abc.medix-inc.co.jpとxyz.medix-inc.co.jp間のような)
【例1】のトラッキングコードでは、ga(‘create’, ‘UA-*******-**’, ‘auto’);の’auto’部分がGoogle アナリティクスで言うsetDomainNameの中身となります。
つまり、abc.medix-inc.co.jpとxyz.medix-inc.co.jp間でサブドメインをまたぐ場合は’auto’を’medix-inc.co.jp’としますので、全体のトラッキングコードは、
【例2】
<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’,’//www.google-analytics.com/analytics.js’,’ga’);
ga(‘create’, ‘UA-XXXX-Y’, ‘medix-inc.co.jp’);
ga(‘send’, ‘pageview’);
</script>
となります。
機能2:別ドメインまたぎ(medix-inc.co.jpとmedix-jirei.com間のような)
ユニバーサル アナリティクスでは、Google アナリティクスの時のように「別ドメインにまたぐリンクの<a>タグにタグを入れなきゃ行けない」ですとか「自動で別ドメインまたぎするjavascriptやjQueryを入れなきゃ」と言ったことは必要なくなります。
ユニバーサル アナリティクスのプラグインをトラッキングコードに追記すればOKです。
まずは【例2】のga(‘create’, ‘UA-*******-**’, ‘auto’);タグに
【例3】
ga(‘create’, ‘UA-XXXX-Y’, ‘auto’, {‘allowLinker’: true});
【例3】のように追記をします。{‘allowLinker’: true}部分がGoogle アナリティクスで言う_gaq.push([‘_setAllowLinker’, true]);に当たります。次に、ドメイン指定をします。下【例4】のプラグインを追記します。
【例4】
ga(‘require’, ‘linker’);
ga(‘linker:autoLink’, [‘medix-inc.co.jp’, ‘medix-jirei.com’]);
全体のトラッキングコードは、サブドメイン対応のタグまで記述すると、medix-inc.co.jpドメイン配下には、
【例5】
<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’,’//www.google-analytics.com/analytics.js’,’ga’);
ga(‘create’, ‘UA-XXXX-Y’, ‘medix-inc.co.jp’, {‘allowLinker’: true});
ga(‘require’, ‘linker’);
ga(‘linker:autoLink’, [‘medix-inc.co.jp’, ‘medix-jirei.com’]);
ga(‘send’, ‘pageview’);
</script>
medix-jirei.comドメイン配下には、
【例6】
<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’,’//www.google-analytics.com/analytics.js’,’ga’);
ga(‘create’, ‘UA-XXXX-Y’, ‘medix-jirei.com’, {‘allowLinker’: true});
ga(‘require’, ‘linker’);
ga(‘linker:autoLink’, [‘medix-inc.co.jp’, ‘medix-jirei.com’]);
ga(‘send’, ‘pageview’);
</script>
となります。
機能3:eコマース(旧式のeコマースと拡張eコマースがあります)
Google アナリティクスでもあったように、ユニバーサル アナリティクスでもeコマースのタグがあります。通常(旧式)のeコマースのタグと拡張eコマースのタグがありますので、順にご紹介します。
通常の(旧式の)eコマースタグは下のタグを購入完了ページにて追加します。
【例7】
ga(‘require’, ‘ecommerce’, ‘ecommerce.js’);
ga(‘ecommerce:addTransaction’, {
‘id’: ‘1234’, // Transaction ID. Required.
‘affiliation’: ‘Acme Clothing’, // Affiliation or store name.
‘revenue’: ‘11.99’, // Grand Total.
‘shipping’: ‘5’, // Shipping.
‘tax’: ‘1.29’ // Tax.
});
ga(‘ecommerce:addItem’, {
‘id’: ‘1234’, // Transaction ID. Required.
‘name’: ‘Fluffy Pink Bunnies’, // Product name. Required.
‘sku’: ‘DD23444’, // SKU/code.
‘category’: ‘Party Toys’, // Category or variation.
‘price’: ‘11.99’, // Unit price.
‘quantity’: ‘1’ // Quantity.
});
ga(‘ecommerce:send’);
商品を複数種類購入した場合はaddItemタグを繰り返します。例えば、複数種類購入時の購入完了ページ(ドメインはmedix-inc.co.jpとする)の全体のトラッキングコードは
【例8】
<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’,’//www.google-analytics.com/analytics.js’,’ga’);
ga(‘create’, ‘UA-XXXX-Y’, ‘medix-inc.co.jp’, {‘allowLinker’: true});
ga(‘require’, ‘linker’);
ga(‘linker:autoLink’, [‘medix-inc.co.jp’, ‘medix-jirei.com’]);
ga(‘require’, ‘ecommerce’, ‘ecommerce.js’);
ga(‘send’, ‘pageview’);
ga(‘ecommerce:addTransaction’, {
‘id’: ‘12345’, // transaction ID – required
‘affiliation’: ‘STORE123’, // affiliation or store name
‘revenue’: ‘1480.00’, // total – required
‘shipping’: ‘0’, // tax
‘tax’: ‘74.00’, // shipping
});
ga(‘ecommerce:addItem’, {
‘id’: ‘12345’, // transaction ID – required
‘name’: ‘商品A’, // product name
‘sku’: ‘a_00001’ , // SKU/code – required
‘category’: ‘Xcategory’, // category or variation
‘price’: ‘700.00’, // unit price – required
‘quantity’: ‘1’, // quantity – required
});
ga(‘ecommerce:addItem’, {
‘id’: ‘12345’,
‘name’: ‘商品B’,
‘sku’: ‘b_00001’,
‘category’: ‘Ycategory’,
‘price’: ‘780.00’,
‘quantity’: ‘1’,
});
ga(‘ecommerce:send’);
</script>
となります。
拡張eコマースのタグは下のタグを購入完了ページにて追加します。
【例9】
ga(‘require’, ‘ec’, ‘ec.js’);
ga(‘ec:addProduct’, {
‘id’: ‘P12345’, // SKU
‘name’: ‘Android Warhol T-Shirt’, // 商品名
‘category’: ‘Apparel’, // 商品カテゴリ(拡張eコマース)
‘brand’: ‘Google’, // 商品ブランド
‘variant’: ‘black’, // 商品バリエーション
‘price’: ‘29.20’, // 商品単価
‘coupon’: ‘APPARELSALE’, // 商品クーポン
‘quantity’: ‘1’ // 数量
});
ga(‘ec:setAction’, ‘purchase’, {
‘id’: ‘T12345’, // (必須) トランザクションID
‘affiliation’: ‘Google Store – Online’, // アフィリエーション
‘revenue’: ‘37.39’, // 収益
‘tax’: ‘2.85’, // 税
‘shipping’: ‘5.34’, // 送料
‘coupon’: ‘SUMMER2013’ //クーポン
});
商品を複数種類購入した場合はaddProductタグを繰り返します。例えば、複数種類購入時の購入完了ページ(ドメインはmedix-inc.co.jpとする)の全体のトラッキングコードは
【例10】
<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’,’//www.google-analytics.com/analytics.js’,’ga’);
ga(‘create’, ‘UA-XXXX-Y’, ‘medix-inc.co.jp’, {‘allowLinker’: true});
ga(‘require’, ‘linker’);
ga(‘linker:autoLink’, [‘medix-inc.co.jp’, ‘medix-jirei.com’]);
ga(‘require’, ‘ec’, ‘ec.js’);
ga(‘ec:addProduct’, { // Provide product details in an productFieldObject.
‘id’: ‘12345’, // Product ID (string).
‘name’: ‘商品A’, // Product name (string).
‘category’: ‘Xcategory’, // Product category (string).
‘brand’: ‘Google’, // Product brand (string).
‘variant’: ‘black’, // Product variant (string).
‘price’: ‘700.00’, // Product price (currency).
‘coupon’: ‘SALE’, // Product coupon (string).
‘quantity’: ‘1’ // Product quantity (number).
});
ga(‘ec:addProduct’, { // Provide product details in an productFieldObject.
‘id’: ‘67890’, // Product ID (string).
‘name’: ‘商品B’, // Product name (string).
‘category’: ‘Ycategory’, // Product category (string).
‘brand’: ‘Yahoo’, // Product brand (string).
‘variant’: ‘red’, // Product variant (string).
‘price’: ‘780.00’, // Product price (currency).
‘coupon’: ‘SALE’, // Product coupon (string).
‘quantity’: ‘1’ // Product quantity (number).
});
ga(‘ec:setAction’, ‘purchase’, { // Transaction details are provided in an actionFieldObject.
‘id’: ‘T12345’, // (Required) Transaction id (string).
‘affiliation’: ‘Google Store – Online’, // Affiliation (string).
‘revenue’: ‘1480.00’, // Revenue (currency).
‘tax’: ‘74.00’, // Tax (currency).
‘shipping’: ‘0’, // Shipping (currency).
‘coupon’: ‘SALE’ // Transaction coupon (string).
});
ga(‘send’, ‘pageview’);
</script>
となります。
拡張eコマースのタグは購入完了ページ以外でも使用することがあります。タグの詳細は今回、割愛しますが、商品毎に下の事が分かるようになります。(要設定)
・商品リストの閲覧回数(商品一覧ページにおける閲覧回数)
・商品リストのクリック数(リストの位置も分かります)
・商品詳細ページの閲覧数
・商品がカートに追加された回数
・商品の決済回数(レジでのチェックアウト)
付随して、全セッション→商品詳細表示→カート追加→決済(チェックアウト)→購入(トランザクション)への遷移セッション数が分かるのでボトルネックの発見には大変、便利です。
設定はシステム側にやや工数が必要ですが、eコマースタグの実装時には一考の価値ありです。拡張eコマースをご利用の場合は、ga(‘require’, ‘ec’, ‘ec.js’);のプラグインを各ページに追加することになりますので、全ページのトラッキングコードに追記しても良いかと思います。
【例11】
<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’,’//www.google-analytics.com/analytics.js’,’ga’);
ga(‘create’, ‘UA-XXXX-Y’, ‘medix-inc.co.jp’, {‘allowLinker’: true});
ga(‘require’, ‘linker’);
ga(‘linker:autoLink’, [‘medix-inc.co.jp’, ‘medix-jirei.com’]);
ga(‘require’, ‘ec’, ‘ec.js’);
ga(‘send’, ‘pageview’);
</script>
機能4:ディスプレイ広告対応(リマーケティングや訪問者の属性情報取得に利用)
Google アナリティクスを用いたリマーケティングや、ユーザーの分布(想定の年齢や性別)、インタレスト カテゴリ(訪問者の想定趣向別(⇒アフィニティ カテゴリ)、想定業種別(⇒購買意向の強いセグメント、他のカテゴリ)のサイト閲覧データが見られます)のレポートを利用時には、下記プラグインを追加する必要があります。
【例12】
ga(‘require’, ‘displayfeatures’);
全体のトラッキングコード(ドメインはmedix-inc.co.jpとする)は
【例13】
<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’,’//www.google-analytics.com/analytics.js’,’ga’);
ga(‘create’, ‘UA-XXXX-Y’, ‘medix-inc.co.jp’, {‘allowLinker’: true});
ga(‘require’, ‘linker’);
ga(‘linker:autoLink’, [‘medix-inc.co.jp’, ‘medix-jirei.com’]);
ga(‘require’, ‘ec’, ‘ec.js’);
ga(‘require’, ‘displayfeatures’);
ga(‘send’, ‘pageview’);
</script>
となります。また、ユニバーサル アナリティクスの「アナリティクス設定」から「プロパティ設定」を選択し、「ユーザー属性とインタレスト カテゴリに関するレポートの有効化」を「オン」にしてください。
機能5:拡張リンクのアトリビューション(ページのクリック箇所の計測)
リンク要素IDが区別されていれば、ページ解析のレポート(クリックの分布が分かるレポート)上で、同じURLを参照する単一ページ上の複数のリンクを自動的に区別することができます。その際には、下の【例14】のプラグインを追加する必要があります。
【例14】
ga(‘require’, ‘linkid’, ‘linkid.js’};
全体のトラッキングコード(ドメインはmedix-inc.co.jpとする)は
【例15】
<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’,’//www.google-analytics.com/analytics.js’,’ga’);
ga(‘create’, ‘UA-XXXX-Y’, ‘medix-inc.co.jp’, {‘allowLinker’: true});
ga(‘require’, ‘linker’);
ga(‘linker:autoLink’, [‘medix-inc.co.jp’, ‘medix-jirei.com’]);
ga(‘require’, ‘ec’, ‘ec.js’);
ga(‘require’, ‘displayfeatures’);
ga(‘require’, ‘linkid’, ‘linkid.js’};
ga(‘send’, ‘pageview’);
</script>
となります。また、ユニバーサル アナリティクスの「アナリティクス設定」から「プロパティ設定」を選択し、「拡張リンク アトリビューションを使用する」を「オン」にしてください。
まとめ
ユニバーサル アナリティクスとGoogle アナリティクスでは、設定する機能が同じであってもタグの記述が異なるので注意が必要です。移行作業で失敗しない為には、現状のGoogle アナリティクスのトラッキングコードがどの程度、カスタマイズされているかを把握した上で、適切な移行を行う事が重要です。
今回、ご紹介した項目(下記(1)~(5))は、適切なデータ取得をするための基本的な設定となります。
(他のカスタマイズ計測や今回の補足は別の機会にて)
機能1:サブドメインまたぎ(abc.medix-inc.co.jpとxyz.medix-inc.co.jp間のような)
機能2:別ドメインまたぎ(medix-inc.co.jpとmedix-jirei.com間のような)
機能3:eコマース(旧式のeコマースと拡張eコマースがあります)
機能4:ディスプレイ広告対応(リマーケティングや訪問者の属性情報取得に利用)
機能5:拡張リンクのアトリビューション(ページのクリック箇所の計測)
Google アナリティクスの現状設定やサイト構成を確認の上、必要な設定を洗い出す事から始めると良いかと思います。