検証サイトと本番サイトそれぞれGAをGTMで一括管理する設定方法

こんにちは。
岐阜でWebマーケをしていますYoshi（@motoy0shi）です。

先日、Google Tag Manager（以下、GTM）を使ってGoogle アナリティクスの解析設計をしていた時、こんな要件が出てきました。

・検証環境と本番環境があり、それぞれ違うホスト名である
・それぞれ検証環境用GAプロパティと、本番環境用GAプロパティがある
・本番環境のリリース前に、検証環境でタグの動作確認をしておきたい
・イベントを発火せるタグが数多くある

こういったケースの解決策として、ドメインを判定してデータを送る先のGAプロパティを変える実装を行いました。

単純にホスト名を使ったフィルタでもよかったのですが、それだとGAのプロパティ設定までは分離できないため、上記の方法を使っています。

あまりWeb上にも情報がなかったので、備忘録として実装方法をまとめておきます。何か必要が迫られた時に、ぜひ活用してみてください。

全体の構成イメージ

今回の実装イメージは、上記のようになります。

検証用サイト（demo.xxx.com）とで確認したソースコードを、本番サイト（xxx.com）にアップロードするようなフローを想定しています。検証用サイト本番サイトには、同じGTMコンテナを設置します。

検証用サイトで発火したヒットは、すべて検証用GAにデータが送られて記録され、本番サイトで発火したヒットは、すべて本番GAプロパティに送られます。

こうすることで、本番と検証のデータを完全に分離できるような形になります。

この実装のメリット・デメリット

■メリット

①完全にデータを分けられるのでノイズの混入を防げる
②トリガーの条件に「ホスト名」を指定しなくてもよくなり、工数やバグのリスクを削減できる
③プロパティを分離できることで、設定の検証が容易にできる

個人的には、特に②トリガーの設定が楽になることが大きいと思っています。Page Hostname などを特別に指定しなくても、GTM側で自動で送り先を変えてくれるので、設定工数は減らせられるのではないでしょうか。

■デメリット

①最初の設定が少し手間になる
②プロパティーが増えてしまう

大きなデメリットは特にありませんが、実装に少し手間がかかるのはマイナスポイントかなと思います。

実装方法

①「正規表現の表」変数を作成

まずは左側のメニューから「変数」を選択し、ユーザー定義変数のフィールドから「新規」をクリックします。

変数の設定をクリックすると、「変数タイプを選択」のモーダルが出てくるので、「正規表現の表」を選択します。

そして以下の設定を行います。

入力変数：{{ Page Hostname }}

正規表現の表
パターン：demo\.xxx\.com　出力：（検証用のトラッキングID）
パターン：xxx\.com　出力：（本番用のトラッキングID）

Advanced Settings
☑️ 　大文字と小文字を区別しない　※これだけチェックを入れる
□　完全一致のみ
□　キャプチャグループと置換機能を有効にする

こうすることで、GTMがドメインを判定し、ドメインにあったGAのトラッキングIDを返してくれるようになります。

また

※注：Page Hostname が候補に出てこない方は、先に「組み込み変数」の「設定」より有効化してください。

【2021年8月30日追記】
Twitterにて、@649Ga4さんより、万が一の計測漏れを防ぐために「デフォルト値」に検証用トラッキングIDを入れたほうがよいとの助言をいただきました。リスク回避のために、デフォルト値は入れておくほうが良いですね。

【2021年8月30日追記】
Twitterにて、@t_t__m_さんよりホスト名のドットはエスケープすべきではないかとの指摘がありましたので、訂正いたしました。

なお「正規表現の表」は、上から条件にマッチした順番で値が返ってきます。サブドメインなどを使う場合は、並び順を気をつけましょう。

詳しくは、ayudanteさんのブログをご参考にしてください。

「正規表現の表」変数で「部分一致が可能なルックアップテーブル的変数」が可能になりました

②Googleアナリティクス変数を作成

正規表現の表ができたら、次はGoogleアナリティクス変数を作成します。「変数」→「ユーザー定義変数」→「新規」から「Googleアナリティクス変数」を選びましょう。

そしてトラッキングIDの項目に、先ほど①で作成した「正規表現の表」変数を指定します。

③GAユニバーサルアナリティクスに、②で作成したGA変数を選択

ここまで来たらほぼ実装は終わりです。「タグ」から「新規」をクリックします。「タグタイプを選択」のメニューから「Googleアナリティクス：ユニバーサルアナリティクス」を選択します。

そして「Googleアナリティクス設定」の項目で、先ほど②で作成したGoogleアナリティクス変数を選択、All Pagesなどのトリガーを指定すれば完成です。

実際の環境に導入する前は、必ずプレビューで想定している挙動をしているか確認すると安心ですね。

おわりに

今回は、検証用環境と本番用環境でGoogleアナリティクスのプロパティを分けたい場合に、GTM側でドメインを判定してデータを送り分ける実装について紹介しました。

トリガーで発火条件を分けることも可能ですが、イベントのタグが増えてくると、検証・本番のタグが煩雑になることが多いです。この方法なら、最小限のタグで検証もスムーズに行えるはず。

かなり限られたケースでしか役立たない実装な気もしますが、どなたかのお役に立てば幸いです。

-------------------

この記事に関するご意見やご感想は、ぜひTwitterなどで教えてください。
最後までお読みいただき、ありがとうございました！

Twitter→https://twitter.com/motoy0shi