Expert guidance for configuring Google Tag Manager variables including built-in variables (Page URL, Page Path, Referrer, Click variables, Form variables), data layer variables, custom JavaScript variables, first-party cookies, lookup tables, regex tables, constant variables, URL variables, DOM element variables, auto-event variables, container variables, and user-defined variables. Use when creating variables, configuring data layer variables, writing custom JavaScript variables, parsing URLs, reading cookies, setting up lookup tables, extracting values from DOM elements, debugging variable values, or working with variable formatting and transformations.
/plugin marketplace add henkisdabro/wookstar-claude-code-plugins/plugin install gtm-suite@wookstar-claude-code-pluginsThis skill inherits all available tools. When active, it can use any tool Claude has access to.
references/google-rew-regular-expressions-syntax.txtreferences/variables.mdExpert guidance for configuring all types of variables in Google Tag Manager that capture, store, and reuse dynamic values across tags and triggers.
Invoke this skill when:
Built-in variables are pre-configured by GTM. Enable them in Variables → Configure:
(Enable when using click triggers)
(Enable when using form triggers)
(Enable for JavaScript error tracking)
(Enable for YouTube video tracking)
Create custom variables in Variables → New:
Most common variable type for accessing data layer values.
Configuration:
ecommerce.purchase.transaction_idproducts.0.nameExample:
// Data Layer:
dataLayer.push({
'event': 'purchase',
'userId': '12345',
'ecommerce': {
'transaction_id': 'T_12345',
'value': 99.99
}
});
// Variables:
userId → "12345"
ecommerce.transaction_id → "T_12345"
ecommerce.value → 99.99
Execute JavaScript to return dynamic values.
Best Practices:
Example:
function() {
// Get current date
return new Date().toISOString();
}
function() {
// Get query parameter
var urlParams = new URLSearchParams(window.location.search);
return urlParams.get('utm_campaign') || 'direct';
}
function() {
// Format price
var price = {{DL - Price}}; // Reference another variable
return '$' + parseFloat(price).toFixed(2);
}
Read cookie values from the browser.
Configuration:
Example:
_ga → Read Google Analytics cookieuser_consent → Read custom consent cookieStore static values to reuse across tags.
Use Cases:
Example:
G-XXXXXXXXXX (GA4 Measurement ID)AW-123456789 (Google Ads ID)Parse components from current page URL or custom URL.
Component Types:
Example:
URL: https://example.com/products?category=shoes&sale=true#top
example.com/productscategory=shoes&sale=truecategory → shoestopMap input values to output values (like a switch statement).
Configuration:
Example: Input: {{Page Path}}
| Input | Output |
|---|---|
| / | homepage |
| /products | product_listing |
| /checkout | checkout |
| Default: other |
Similar to Lookup Table but uses Regular Expressions for pattern matching.
Configuration:
Example: Input: {{Page Path}}
| Pattern | Output |
|---|---|
| ^/$ | homepage |
| ^/products/.* | product_page |
| ^/blog/.* | blog_post |
| ^/checkout | checkout |
| Default: other |
Extract values from page elements using CSS selectors.
Configuration:
Examples:
h1 → Get first H1 text#product-price, Attribute: data-price → Get price from data attribute.user-email → Get email element textAccess properties of auto-events (clicks, forms, etc.).
Variable Type: Select specific auto-event property
These are usually just enabled as built-in variables instead.
Access event parameters from enhanced measurement or custom events.
Configuration:
(Available in GTM web containers) Fetch values from Google Sheets.
Use Cases:
Get the referrer URL (same as built-in Referrer variable, but user-defined for custom formatting).
Access global JavaScript variables.
Configuration:
Example:
dataLayer → Access data layer arrayuser.email → Access window.user.emailuserId)DL - User IDfunction() {
return /* your logic */;
}
CJS - DescriptionLUT - Descriptionutm_source)(direct) or other fallbackURL - UTM SourceCookie - NameUse consistent prefix format: [Type] - [Description]
Examples:
DL - User ID (Data Layer)CJS - Format Price (Custom JavaScript)URL - UTM Campaign (URL)Cookie - Session ID (First-Party Cookie)Constant - GA4 ID (Constant)LUT - Page Type (Lookup Table)Search reference files for specific topics:
grep -r "Data Layer Variable" references/
grep -r "Custom JavaScript" references/
grep -r "Lookup Table" references/
// Get current timestamp
function() {
return Date.now();
}
// Get query parameter
function() {
var params = new URLSearchParams(window.location.search);
return params.get('campaign') || 'none';
}
// Format currency
function() {
var value = {{DL - Price}};
return '$' + parseFloat(value).toFixed(2);
}
// Get array length
function() {
var items = {{DL - Cart Items}} || [];
return items.length;
}
Use when working with Payload CMS projects (payload.config.ts, collections, fields, hooks, access control, Payload API). Use when debugging validation errors, security issues, relationship queries, transactions, or hook behavior.
Applies Anthropic's official brand colors and typography to any sort of artifact that may benefit from having Anthropic's look-and-feel. Use it when brand colors or style guidelines, visual formatting, or company design standards apply.
Creating algorithmic art using p5.js with seeded randomness and interactive parameter exploration. Use this when users request creating art using code, generative art, algorithmic art, flow fields, or particle systems. Create original algorithmic art rather than copying existing artists' work to avoid copyright violations.