Google Tag Manager の命名規則を考えてみた [設計編] の記事で策定した命名規則の実践編として、今回は実際に実装した変数をいくつか紹介します。
Variable - Domain
種類を選択
定数
値
example.com
Variable - Page Title
種類を選択
カスタム JavaScript
カスタム JavaScript
/**
* ページタイトルを返す
*
* @return {String}
*/
function() {
return document.title;
}
Variable - User Agent
種類を選択
カスタム JavaScript
カスタム JavaScript
/**
* ユーザーエージェントを返す
*
* @return {string}
*/
function() {
return navigator.userAgent;
}
Variable - Click URL Hostname
種類を選択
自動イベント変数
変数タイプ
要素 URL
要素タイプ
ホスト名
「www.」を削除
真
Variable - Search Query
設定した検索結果ページのクエリパラメータを取得するために定義しています。(クエリキーはサイトに合わせて修正して下さい)
以下の設定だと http://example.com/?query=test でアクセスされた時に値として test が入ります。
種類を選択
URL
要素タイプ
クエリ
クエリキー
query
Variable - Social Action - Like
ソーシャルタグを追加する際に指定するアクションの値を定数化したものを用意しました。タグの編集ページで直接入力してもいいですが、定数にすることで、値の一括置換や補完候補に出すことができるようになり、入力間違いもなくなるので、何回も使う値に関しては定数にしています。似たようなものとして、Variable - Social Action - Fan, Variable - Social Action - Tweet もあります。
種類を選択
定数
Configure Variable
Like
Variable - Social Network - Facebook
ソーシャルタグを追加する際に指定するネットワークの値を定数化したものを用意しました。
種類を選択
定数
Configure Variable
GA - Variable - Tracking ID - Production
本番用のトラッキングコードを定義しています。
種類を選択
定数
値
UA-12345678-9
GA - Variable - Tracking ID - Staging
ステージング環境用のトラッキングコードを GA - Variable - Tracking ID - Production と同じ要領で定義しています。
GA - Variable - Tracking ID - Develop
デベロップ環境用のトラッキングコードを GA - Variable - Tracking ID - Production と同じ要領で定義しています。
GA - Variable - Tracking ID
種類を選択
ルックアップ テーブル
ルックアップ テーブルは入力に対して、マッチしたものを出力として返すので、環境ごとのGAトラッキングコードを自動で設定されるようにしています。
例として、あるタグに設定したトラッキングコードは example.com では GA - Variable - Tracking ID - Production で定義した値が展開されて設定されて配信されます。
変数を入力
{{Page Hostname}}
ルックアップ テーブル
| Input | Output |
|---|---|
| example.com | {{GA - Variable - Tracking ID - Production}} |
| staging.example.com | {{GA - Variable - Tracking ID - Staging}} |
| develop.example.com | {{GA - Variable - Tracking ID - Develop}} |
GA - Variable - Virtual Page View
SPA等で仮想ページビューを計測する必要がある場合に dataLayer に push してGTMが受け取るために定義しています。ページングとかでページ遷移が発生せずにページが切り替わる場合以下のようにします。
dataLayer.push({
virtualPageView: '/page/2'
});
種類を選択
データレイヤーの変数
データレイヤーの変数名
virtualPageView
GA - Variable - Utm Source
種類を選択
URL
要素タイプ
クエリ
クエリキー
utm_source
GA - Variable - Utm Campaign
種類を選択
URL
要素タイプ
クエリ
クエリキー
utm_campaign
GA - Variable - Utm Content
種類を選択
URL
要素タイプ
クエリ
クエリキー
utm_content
GA - Variable - Utm Medium
種類を選択
URL
要素タイプ
クエリ
クエリキー
utm_medium
GA - Variable - Utm Term
種類を選択
URL
要素タイプ
クエリ
クエリキー
utm_term