このサイトでは何回かGoogle Analyticsについて触れていますが、みなさんは最新のGoogle Analyticsの情報をご存じでしょうか？
以前下記記事で紹介をさせていただいたものは、実はちょっと前のGoogle Analytics……正確に言うと、トラッキングコードが最新ではありません。
Google Analytics
http://beginner-seogirl.com/blog/girls-column/google-tool-column4/
イベントトラッキング
http://beginner-seogirl.com/blog/days-it-girl/event-tracking-analytics/
Google Analyticsのデータはトラッキングコードをサイト内に設置することで取得をしていますが、少し前までこのトラッキングコードに使用されていたのは「analytics.js」というものが使われていました。
しかし！実はこのトラッキングコードに使用されているタグが新しくなっていたのです！
その名も「Global Site Tag」(gtag.js)
一体どのように変わったのか、どうすれば良いのかをご紹介します！！
変更した点
analytics.js(従来のタグ)とgtag.js(新しいタグ)の違いはなんでしょうか？
- タグの記述方法と設置位置
- データの送信がデフォルトで「送信」になった
- イベントトラッキングの計測方法
というところでしょうか？それではひとつずつ見ていきます！
まずはタグの記述方法です。これは従来の記述と大きくかわり、なんだかスリムになったイメージ。
また記述の位置も変更になっています。
analytics.js(従来のタグ)
<html>
<head>
<meta charset="UTF-8">
<title>Googleの便利ツールその4｜SEO女子コラム</title>
<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-1010101011-0', 'auto');
ga('send', 'pageview');
</script>
</head>
従来までのタグはheadタグの終わり直前に入れるように、ということでした。しかし新しいタグでは…。
gtag.jp(新しいタグ)
<html>
<head>
<script async src="https://www.googletagmanager.com/gtag/js?id=UA-10101011-1"></script>
<script>
window.dataLayer = window.dataLayer || [];
function gtag(){dataLayer.push(arguments);}
gtag('js', new Date());
gtag('config', 'UA-10101011-1');
</script>
<meta charset="UTF-8">
<title>Googleの便利ツールその4｜SEO女子コラム</title>
</head>
なんだかタグがスッキリしたように見えませんか！？しかも、headタグ直下に設置しろとのこと。ここが大きく違う点です。
ちなみに、複数のトラッキングコードを設置したい場合は「config」と書かれている部分を入れるだけで複数計測ができるそうです。
<html>
<head>
<script async src="https://www.googletagmanager.com/gtag/js?id=UA-10101011-1"></script>
<script>
window.dataLayer = window.dataLayer || [];
function gtag(){dataLayer.push(arguments);}
gtag('js', new Date());
gtag('config', 'UA-10101011-1');
gtag('config', 'UA-20202022-1');
</script>
<meta charset="UTF-8">
<title>Googleの便利ツールその4｜SEO女子コラム</title>
</head>
こんな感じ！
実は以前まではタグの中に「Analyticsにデータを送信します」という命令が入っていました。そのため、その命令を削除したらデータが送信されないという仕組み。
しかし、今回のgtag.jpからは何の命令も入れなくてもデータが送信されます。これは逆に、データを送信したくない場合は「送信しないでね」という命令を入れないといけないということに…。
これもタグの仕様が変わったので記述方法が変更になりました。どのように変わったかはまた別の機会に細かくご紹介しましょう！
実装方法は簡単！
では、以前のanalytics.jsからはどのように移行すればいいでしょうか？
タグをカスタマイズしている方は他のサイトなどでしっかりと移行方法を見ていただくとして、ここでは私のように初心者向けに説明をします。
まず、Google Analyticsの設定より、自分のプロパティのトラッキングコードを見ます。
ここに新しいgtag.jsが書いてあるので、コピー！
その後自分のサイトの全てのページで、analytics.js部分を消してしまいます。
そしてheadの下にコピーしてきたタグを貼り付けます。
以上！
もちろん、細かく計測を分けているような場合はそれぞれ記述わけが必要ですが、あまりそのような事をしていな場合は上書きで問題ありません。
また、以前のanalytics.jsでも引き続きアクセスは計測できます。急いで変更する必要はなく、きちんと書き換え方などを理解してからの移行でも問題ないでしょう。
初めまして。suirindoと申します。記事を拝見いたしました。１点質問があるのですが、お答えいただけますと幸いです。
複数のトラッキングコード設置について、
＞＞ちなみに、複数のトラッキングコードを設置したい場合は「config」と書かれている部分を入れるだけで複数計測ができるそうです。
と記載されておりますが、ソースを教えていただけますでしょうか。
よろしくお願いいたします。
suirundo様
サイトへの訪問ありがとうございます！
上記いただきました
「複数のトラッキングコードを設置したい場合は「config」と書かれている部分を入れるだけで複数計測ができるそうです。」
こちらは複数のGoogle アナリティクス プロパティ設定を指しており、公式のデベロッパーページをソースとしております。
https://developers.google.com/analytics/devguides/collection/gtagjs/
＞追加の Google アナリティクス プロパティを設定する