Comprehensive Google Tag Manager guide covering container setup, tags, triggers, variables, data layer, debugging, custom templates, and API automation. Use when working with GTM implementation, configuration, optimisation, troubleshooting, or any GTM-related tasks.
/plugin marketplace add henkisdabro/wookstar-claude-code-plugins/plugin install henkisdabro-marketing-marketing@henkisdabro/wookstar-claude-code-pluginsThis skill inherits all available tools. When active, it can use any tool Claude has access to.
references/api.mdreferences/best-practices.mdreferences/custom-templates.mdreferences/datalayer.mdreferences/debugging.mdreferences/setup.mdreferences/tags.mdreferences/triggers.mdreferences/variables.mdThis skill provides comprehensive expertise for Google Tag Manager (GTM), covering container setup, tag configuration, triggers, variables, data layer implementation, debugging, custom templates, and API automation. Whether you are implementing a new GTM setup, optimising an existing configuration, or troubleshooting issues, this skill has you covered.
Invoke this skill when:
See setup.md for detailed installation instructions.
// Example: GA4 Configuration Tag
Tag Type: Google Analytics: GA4 Configuration
Measurement ID: G-XXXXXXXXXX
Trigger: All Pages
See tags.md for comprehensive tag documentation.
// Push custom event to data layer
window.dataLayer = window.dataLayer || [];
dataLayer.push({
'event': 'custom_event',
'category': 'engagement',
'action': 'button_click',
'label': 'CTA Button'
});
See datalayer.md for data layer patterns.
Tags are snippets of code that execute on your site (e.g., GA4, Google Ads, Facebook Pixel).
Triggers define when tags fire (e.g., page views, clicks, form submissions).
Variables capture dynamic values for use in tags and triggers (e.g., page URL, click text, data layer values).
User Action --> Trigger Fires --> Tag Executes --> Data Sent
^ |
| v
+--- Variables provide values -------+
For container creation, snippet installation, and initial configuration:
For configuring analytics, advertising, and custom tags:
For setting up firing conditions:
For capturing and formatting data:
For implementing the data layer:
For troubleshooting GTM implementations:
For naming conventions, performance, and security:
For building custom tag and variable templates:
For programmatic GTM management:
form_submitSee debugging.md for detailed debugging workflows.
GTM Custom JavaScript Variables and Custom HTML Tags require ES5 syntax:
// Use var instead of const/let
var myVar = 'value';
// Use function instead of arrow functions
var myFunc = function(x) { return x * 2; };
// Use string concatenation instead of template literals
var message = 'Hello, ' + name;
Exception: Custom Templates support some ES6 features in their sandboxed environment.
GTM uses RE2 regex syntax, which differs from standard JavaScript regex:
Supported: Character classes, quantifiers, anchors, groups, alternation Not Supported: Lookahead, lookbehind, backreferences, possessive quantifiers
# Match product pages
^/products/[^/]+$
# Case-insensitive matching
(?i)^/checkout
Format: [Platform] - [Type] - [Description]
Examples:
GA4 - Event - Form SubmitGoogle Ads - Conversion - PurchaseFB - Pixel - Page ViewFormat: [Event Type] - [Description]
Examples:
Click - CTA ButtonPage View - HomepageForm Submit - Contact FormFormat: [Type] - [Description]
Examples:
DL - User ID (Data Layer)CJS - Format Price (Custom JavaScript)Constant - GA4 Measurement ID// Page view
window.dataLayer.push({ 'event': 'page_view' });
// User login
window.dataLayer.push({ 'event': 'login', 'method': 'Google' });
// Purchase
window.dataLayer.push({
'event': 'purchase',
'ecommerce': {
'transaction_id': 'T12345',
'value': 99.99,
'currency': 'AUD',
'items': [...]
}
});
| Topic | Reference File |
|---|---|
| Container setup | setup.md |
| Tag configuration | tags.md |
| Trigger configuration | triggers.md |
| Variable configuration | variables.md |
| Data layer | datalayer.md |
| Debugging | debugging.md |
| Best practices | best-practices.md |
| Custom templates | custom-templates.md |
| API automation | api.md |
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.
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.