グローバル サイトタグ(gtag.js)について
【第1回】グローバル サイトタグ(gtag.js)の基本

  • このエントリーをはてなブックマークに追加

この記事では、Google アナリティクスやGoogle 広告(旧:Google AdWords)の新しい形式のタグであるグローバルサイトタグ(gtag.js)について、下記テーマで3回にわたって書いていきます。

【第1回】グローバル サイトタグ(gtag.js)の基本

【第2回】グローバル サイトタグ(gtag.js)を用いたGoogle アナリティクスの必須設定

【第3回】グローバル サイトタグ(gtag.js)を用いたGoogle アナリティクス・Google オプティマイズの追加設定

<目次>

1.グローバル サイトタグ(gtag.js)とは

グローバル サイトタグ(gtag.js)は、Google アナリティクスやGoogle 広告(旧:Google AdWords)のタグをまとめて記載することができるタグです。
主に
・Google アナリティクスタグ
・Google 広告(旧:Google AdWords) リマーケティングタグ(コンバージョンタグの場合には、追加タグが必要)
として利用可能です。

グローバル サイトタグ(gtag.js)が登場した経緯としては、Safariブラウザに搭載のITP※への対応が挙げられます。
※Intelligent Tracking Preventionの略。2017年9月20日にiPhoneやiPad向けのOSとしてリリースされたiOS 11のSafariや、Mac用OSのmacOS High SierraのSafariに対して、3rd Party Cookieでの広告計測、リターゲティングができなくなる仕様です。

2.グローバル サイトタグ(gtag.js)の発行

ベースのタグは、Googleアナリティクス、Google 広告(旧:Google AdWords)の、どちらの管理画面からも作成することができます。

■Google アナリティクス経由で作成

Google アナリティクス管理画面の「管理」から「プロパティ」>「トラッキング情報」>「トラッキングコード」にて出力可能です。
※Google アナリティクスタグとなります。

手順1:「管理」をクリック

手順2:「プロパティ」>「トラッキング情報」>「トラッキングコード」をクリック

手順3:グローバル サイトタグ(gtag.js)をコピーし、htmlソースの<head>直後に実装

<!– Global site tag (gtag.js) – Google Analytics –>
<script async src=”https://www.googletagmanager.com/gtag/js?id=UA-12345-6″></script>
<script>
window.dataLayer = window.dataLayer || [];
function gtag(){dataLayer.push(arguments);}
gtag(‘js’, new Date());

gtag(‘config’, ‘UA-12345-6’);
</script>

■Google 広告(旧:Google AdWords)経由で作成

(Google 広告(旧:Google AdWords)管理画面の「ツール」から「測定」>「コンバージョン」>「+」>「ウェブサイト(通常は)」にてコンバージョンタグ作成時に出力可能です。
※Google 広告(旧:Google AdWords)リマーケティングタグとなります。

<!– Global site tag (gtag.js) – AdWords –>
<script async src=”https://www.googletagmanager.com/gtag/js?id=AW-123456789″></script>
<script>
window.dataLayer = window.dataLayer || [];
function gtag(){dataLayer.push(arguments)};
gtag(‘js’, new Date());

gtag(‘config’, ‘AW-123456789’);
</script>

■グローバル サイトタグのカスタマイズ(集約)

Google アナリティクス経由で作成したグローバル サイトタグ(gtag.js)
=Google アナリティクスタグ

Google 広告(旧:Google AdWords)経由で作成したグローバル サイトタグ(gtag.js)
=Google 広告(旧:Google AdWords)リマーケティングタグ
を1つのグローバル サイトタグ(gtag.js)に集約する場合には、どちらかのグローバル サイトタグ(gtag.js)をベースとして、もう一方のグローバル サイトタグ(gtag.js)の一部、
「gtag(‘config’,・・・」「gtag(‘set’,・・・」「gtag(‘event’,・・・」
で始まるタグを追加する必要があります。

カスタマイズ例1

Google アナリティクスで発行したタグ(プロパティID:UA-12345-6)にGoogle 広告(旧:Google AdWords) タグ(コンバージョンID:123456789)を追加する場合、

<Googleアナリティクスで発行したタグ>
——————————
<!– Global site tag (gtag.js) – Google Analytics –>
<script async src=”https://www.googletagmanager.com/gtag/js?id=UA-12345-6″></script>
<script>
window.dataLayer = window.dataLayer || [];
function gtag(){dataLayer.push(arguments);}
gtag(‘js’, new Date());

gtag(‘config’, ‘UA-12345-6’);
</script>
——————————

<追加するタグ>
——————————
gtag(‘config’, ‘AW-123456789’);
——————————

<実装するタグ>
——————————
<!– Global site tag (gtag.js) – Google Analytics –>
<script async src=”https://www.googletagmanager.com/gtag/js?id=UA-12345-6″></script>
<script>
window.dataLayer = window.dataLayer || [];
function gtag(){dataLayer.push(arguments);}
gtag(‘js’, new Date());

gtag(‘config’, ‘UA-12345-6’);
gtag(‘config’, ‘AW-123456789’);
</script>
——————————

となります。

<実装するタグ>を<head>タグ直後に実装することで、Google アナリティクスタグとGoogle 広告(旧:Google AdWords)のリマーケティングタグが貼られたことになります。
この時、「https://www.googletagmanager.com/gtag/js?id=UA-12345-6」のid部分は変更不要です。

逆に、Google 広告(旧:Google AdWords)ベースのグローバル サイトタグ(gtag.js)にGoogle アナリティクスタグを追加(例えば、gtag(‘config’, ‘UA-12345-6’);を追加)する場合であっても、「https://www.googletagmanager.com/gtag/js?id=AW-123456789」のid部分は変更不要です。

・カスタマイズ例2

Google アナリティクスやGoogle 広告(旧:Google AdWords)のアカウントが複数あり、それらを1つのグローバル サイトタグ(gtag.js)に集約する場合も同様です。
仮に、Google アナリティクス経由のグローバル サイトタグ(gtag.js)をベースとすると、

<実装するタグ>
<!– Global site tag (gtag.js) – Google Analytics –>
<script async src=”https://www.googletagmanager.com/gtag/js?id=UA-12345-6″></script>
<script>
window.dataLayer = window.dataLayer || [];
function gtag(){dataLayer.push(arguments);}
gtag(‘js’, new Date());

gtag(‘config’, ‘UA-12345-6’);
gtag(‘config’, ‘UA-12345-7’);
gtag(‘config’, ‘AW-123456789’);
gtag(‘config’, ‘AW-223456789’);
</script>

になります。

3. Google 広告(旧:Google AdWords)のコンバージョンタグの発行

Google 広告(旧:Google AdWords)のコンバージョンタグについては、Google 広告(旧:Google AdWords)の管理画面の「ツール」から、
「測定」>「コンバージョン」>「+」>「ウェブサイト(通常は)」で作成可能です。

コンバージョンページのグローバル サイトタグ(gtag.js)の直後でかつ<head>内に

<!– Event snippet for CONVERSION_NAME conversion page –>
<script>
gtag(‘event’, ‘conversion’, {
‘send_to’: ‘AW-123456789/AbC-D_efG-h12_34-567’
‘value’: 100000.0,
‘currency’: ‘JPY’
});
</script>

を追加します。
※コンバージョンIDや金額、通貨は仮で示しています。コンバージョンの形式によって変数などは変わります。

4.グローバル サイトタグ(gtag.js)を使うべきか?

Google アナリティクスについては、今後の機能追加でグローバル サイトタグ(gtag.js)が中心になるかもしれません。
ですが、Google アナリティクスの計測Cookieは元から1st Party Cookieですので、現状のタグがユニバーサル アナリティクス(analytics.js)で実装済みであれば、すぐにグローバル サイトタグ(gtag.js)に替えずとも良いかと思います。

ただ、Google 広告(旧:Google AdWords)については、ITP対応(iPhoneなど、Safariからのコンバージョンの正確な計測)のため、グローバル サイトタグ(gtag.js)かコンバージョンリンカータグ(Google タグマネージャ経由)を実装する必要があります。

グローバル サイトタグ(gtag.js)での
①Google アナリティクス各種追加設定タグ(クロスドメイン、バーチャルページビュー、イベントトラッキング、拡張EC(完了のみ)、カスタムディメンション)
②Google オプティマイズタグ
の実装については、次回以降の記事を参照ください。

  • このエントリーをはてなブックマークに追加