LoginSignup
17
19

More than 5 years have passed since last update.

GTMにおけるレイヤー変数の導入方法

Posted at

GoogleTagManagerでGoogleAnalyticsのトラッキングをたたく場合、
特定の変数をクエリパラメータに埋め込みたいという要望があるかと思います。

そんなときに便利なレイヤー変数の導入方法について、簡単にまとめてみたのでメモしておきます。

GTM側の設定

コンテナを選択

Google タグマネージャ公式サイト からログインし、自分のアカウントにアクセスしてください。

ここでは、GTMのバージョン2の管理画面で説明していきます。

上部タブからコンテナを選択します。

qiita_gtm_9.png

レイヤー変数の定義

レイヤー変数として扱う変数を定義します。
左側のペインから変数をクリック

qiita_gtm_5.png

下の方にあるユーザー定義変数から新規をクリック
qiita_gtm_6.png

ここで、変数名は自由につけられます。(今回はdltestとしました)

続いて種類を選択からデーターレイヤーの変数を選択
データレイヤーの変数名を設定(今回はdltestとしました)

データレイヤーのバージョンですが、今回はシンプルなバージョン1を使います。

qiita_gtm_8.png

タグ名は自由に設定できます。(dltestとしました)
最後に変数を作成をクリックしてください。

これで変数の定義はできました。あとは使うだけです。

データレイヤー変数をタグから使用する

ゼロからタグを作成します。
左側のペインから`タグを選択。

qiita_gtm_1.png

右側のペインから新規をクリック。
タグ名は自由につけられます。(今回はGA_TESTとしました)
今回はGoogle Analytics(ユニバーサルアナリティクス)を使うので、以下のように選択。

1.Google Analytics を選択
2.ユニバーサルアナリティクスを選択

続いて測定したいGAのトラッキングコードを貼付けます。
PV計測をしたいので、トラッキングタイプはページタイプにします。

こんな感じになるかと思います。

qiita_gtm_2.png

その他の設定、設定するフィールドと順に開き、+フィールドと書かれているボタンをクリックします。すると以下のような画面になったかと思います。

qiita_gtm_3.png

ここで、フィールド名には送信したいクエリパラメータのkeyを指定、値にはvalueを指定します。
フィールドパラメータの先頭には&を付加してください。でないとうまく計測されません。

さて、ここで送信するvalueに、先ほど定義したレイヤー変数を使いたいので、
値の右の +ボタンをクリックし、出てくるモーダルから先ほど定義した変数名を選択します。すると以下のようになります。

Screen Shot 2015-03-30 at 0.28.44.png

今回はページロード時にトラッキングを送信するので、すべてのページを選択します。
最後にタグの作成をクリック。これでGTM側の設定は終了です。
作成したタグは右上の公開ボタンから公開しましょう。

Screen Shot 2015-03-30 at 0.30.43.png

注)SPA(Single Page Application)などの場合、すべてのページ( All Pages)ではファーストランディング時しかトラッキングされません。この場合は自分でトリガーを設定して任意のイベント時にトラッキングするように設定が必要です。

ソース側の設定

dataLayerにpushする時にパラメータを追加します。
トラッキングを行うページに以下のようなタグを設定します。
注)GTMワンタグよりも前に宣言してください。

<script type="text/javascript">
  window.dataLayer = window.dataLayer || [];
  dataLayer.push({
    'dltest': 'hogehoge'
  });
</script>

これでdataLayerに値がpushされます。

確認

ページリロード時に、以下のようなリクエストが飛んでいれば成功です。
http://www.google-analytics.com/collect?...&dltest=hogehoge...

レイヤー変数の値さえ送ってしまえば、GTMの設定次第で、計測するパラメータを変更できるので、色々試してみると良いと思います。

17
19
2

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
17
19