この記事は Google Tag Manager Advent Calendar 2018 - Adventar 4日目の記事です。
共通のキーを利用した組み込み変数
GTMの組み込み変数にはデータレイヤー変数を参照しているものが多く用意されている。Click~で始まるものと、Form~で始まるものは、次の公式ヘルプを見るとわかるが、データレイヤー変数中の同一のキーを参照する。
それらの組み込み変数は結局同じ要素を指しているため、同じ値を参照する。運用の面でいえば同じ組み込み変数にまとめてもいいだろうし、可読性の面からトリガー毎に区別してもよいだろう。
dataLayerキー名別一覧
dataLayerキー名: gtm.element
- Click Element
- Form Element
Click Elementはすべての要素クリックトリガーではクリックイベントが発生したDOM要素、リンクのみクリックトリガーではaまたはareaタグのDOM要素となる。
Form ElementはformタグのDOM要素となる。
いずれもトリガー条件のうちの「CSSセレクタに一致する」の対象とすることができる。
dataLayerキー名: gtm.elementClasses
- Click Classes
- Form Classes
前述のClick Element, Form Elementに対するClass属性値となる。CSSセレクタではないのでClassだからって先頭に「.」がついたりはしない。トリガーの条件にする際は一つの要素に対してClassが複数付く可能性についても考慮しておく必要があるだろう。
文字列なので、CSSセレクタに一致するの対象とすることもできない。
dataLayerキー名: gtm.elementId
- Click ID
- Form ID
前述のClick Element, Form Elementに対するID属性値である文字列である。IDだからって先頭に「#」がついたりはしない。
dataLayerキー名: gtm.elementTarget
- Click Target
- Form Target
Target属性の文字列である。リンクのみクリックトリガー、フォーム送信トリガーで「タグの配信を待つ」の条件に使えたらいいなあと思うのだが、残念ながら条件はPVイベント時に満たす必要があるため使えない。
dataLayerキー名: gtm.elementUrl
- Click URL
- Form URL
Click Element, Form Element要素の属性中でURLとなる文字列。クリックした要素が画像であれば画像のURLとなるし、リンクのみトリガー時であればhref属性の値、フォーム送信時には送信先URLとなるだろう。
dataLayerキー名: gtm.elementText
- Click Text
- Form Text
Click Element, Form Element要素のinnerTextをいい感じに加工した文字列。空白とか改行とかはうまい具合に取り除かれているので、トリガー条件にはうまい具合に対応してあげる必要がある。
所感
参照先が被っている要素は他にもたくさんあったような気がしたのだが、Click系とForm系だけだったよう。