Lesson 7 of 15
Data Layer Variables
① Connect your GTM container
Paste your container ID to load it into this page. It only ever runs here.
Advanced: use a specific environment
Real sites rarely push flat values. They push nested objects, grouping a page, a user and a clicked thing into their own little trees. This page does the same: on load it pushed a page_data object with page and user branches inside it.
To pull a value out of a branch you give the Data Layer Variable Name a dotted path like user.plan or cta.id. GTM walks the dots into the pushed object and returns the value at the end, so one variable type reaches any depth.
Goal
Read nested dataLayer values with dotted Data Layer Variables and fire a tag on the cta_click event.
Build it in GTM
Make a Data Layer Variable for a nested key
Go to Variables in the left sidebar, then under User-Defined Variables click New and choose Data Layer Variable.
- In Data Layer Variable Name type
page.type, the dotted path is how GTM walks frompage_data.pageinto itstypekey. - Name it
DLV - page.typeand Save.
- In Data Layer Variable Name type
Repeat for the other nested keys
Make the same kind of variable foruser.plan,cta.idandcta.text. Each one is a separate Data Layer Variable with a dotted name, not a single variable reading the whole object.Create a Custom Event trigger for cta_click
Triggers → New → Custom Event, set Event name tocta_click. This matches the event the button below pushes, so a tag can read thecta.*values at that moment.Fire a tag on the trigger
New tag → Custom HTML, name itCustom HTML - Testand paste<script></script>, set thecta_clicktrigger as its firing trigger. On the real site this would be a GA4 Event tag sending{{DLV - cta.id}}and{{DLV - cta.text}}as parameters.
Debug in Tag Assistant
Copy this lesson's live URL and paste it into GTM Preview, that is the page Tag Assistant connects to. It has the clickable elements, so this page stays clean for reading.
- In your GTM, click Preview.
- Paste the live URL above and click Connect.
- Interact with the live page and watch your tag fire in Tag Assistant.
What you should expect to see
{{DLV - cta.id}} resolves to hero and {{DLV - cta.text}} to Start free trial, the dotted name reached into the nested object. Your tag appears under Tags Fired on the cta_click event.Verify your container
Built it? Export your container, Admin → Export Container, choose your workspace, then drop the JSON here to check it against this lesson.
Drop your container .json here
or browse · checked in your browser, nothing is uploaded