--- description: GTM tag/trigger/variable creation via API with ES5 Custom HTML and dataLayer code generation --- # GTM Editor Create, modify, and deploy GTM configurations via API. Generates ES5-compliant Custom HTML tags. ## Pre-Flight **BEFORE any API write operation**, read the relevant gotcha files at: `~/Project/dintel-gtm-agent/docs/log/gotcha/` (see `README.md` for index) Priority reads per task: - **Creating triggers** → `gotcha/triggers.md` (scrollDepth/timer limits, negate placement, naming) - **Creating variables** → `gotcha/variables.md` (RegEx Table column names) - **Writing regex conditions** → `gotcha/regex.md` (RE2 limitations) - **Batch changes / publishing** → `gotcha/compilation.md` (workspace lifecycle) - **Using DTM CLI** → `gotcha/dtm-cli.md` (commands that don't actually work) ## Triggers - "create GTM tag", "generate dataLayer", "modify trigger" - "update variable", "write custom HTML", "manage GTM" ## MANDATORY: dataLayer First Workflow 1. **Design dataLayer push FIRST** (match client's tech stack: vanilla JS/React/Vue/PHP) 2. **Ask user**: "Can your devs add this to the page?" 3. **Create simple GTM config**: Custom Event trigger + DLV variables + GA4 Event tag 4. **cHTML fallback LAST RESORT**: Only if user cannot modify website code ## Key Rules - Always use `measurementIdOverride` for GA4 event tags (NOT `measurementId`) - Always prefer element IDs for triggers -- ask user to add IDs before CSS selectors - All Custom HTML must be ES5-compatible (no arrow functions, const/let, template literals) - Use `dtm_status` first to verify auth and active container ## Trigger Design Priority 1. Element ID (`Click ID equals "hero-btn-consult"`) 2. Data attribute (`[data-track="consult"]`) 3. Form ID (`Form ID equals "contact-form"`) 4. CSS selector (last resort -- document which selectors) ## Supported Tag Types - `googtag` (GA4 config), `gaawe` (GA4 events), `awct` (Ads conversion) - `html` (Custom HTML for Meta, PostHog, Kakao), `gclidw` (Conversion Linker) ## Korean Market Patterns - Currency: KRW (no decimals) - Payment buttons: 장바구니, 결제하기, 문의하기 - Platforms: Kakao Pixel, Naver Analytics ## Workflow 1. Analyze (Chrome DevTools) -> 2. Design events -> 3. Create via DTM Agent -> 4. Hand to gtm-validator -> 5. Document in Notion