The GTM Triggers and Tags Cookbook: 4 Ready-to-Use Recipes

Most GTM setups get stuck at the same handful of use cases: track a button click, catch a scroll depth, fire on a form submission. You don't need to invent a trigger structure from scratch for these, they follow the same reliable pattern every time. This is a cookbook of the four most common trigger and tag combinations, ready to build directly in your own container.

Recipe 1: Track a Button Click

First, in Variables, enable the built-in "Click Text" and "Click Classes" variables under the Clicks section, GTM ships these disabled by default. Create a new trigger, type "Just Links" if it's an actual link, or "All Elements" for a button that isn't an anchor tag, set it to fire on "Some Clicks," and add a condition matching Click Text or Click Classes to the specific button you're targeting.

Trigger type: Click - All Elements
Fires on: Some Clicks
Condition: Click Classes  contains  cta-button-primary

Attach this trigger to a GA4 Event tag with an event name like cta_click, and pass the Click Text variable as an event parameter so your reports show which specific button copy was clicked, not just that a click happened somewhere.

Recipe 2: Track Scroll Depth

GTM has a built-in Scroll Depth trigger type, no custom code needed. Create a trigger of type "Scroll Depth," and set vertical scroll percentages at whatever thresholds matter to you, 25/50/75/90 is a common default that gives you a usable funnel of how far people actually read.

Trigger type: Scroll Depth
Vertical Scroll Percentages: 25, 50, 75, 90
This trigger fires on: All Pages

Enable the built-in "Scroll Depth Threshold" variable so you can pass which percentage was hit as an event parameter, a single trigger firing four times with different parameter values is more useful than four separate triggers.

Recipe 3: Track Form Submissions

GTM's built-in Form Submission trigger listens for native HTML form submit events, but many modern forms (React-based, some form-builder plugins) intercept the native submit and never let this fire. Test with GTM Preview first, if the built-in trigger doesn't catch it, fall back to a Click trigger on the submit button itself as a more reliable substitute.

Trigger type: Form Submission
This trigger fires on: Some Forms
Condition: Form ID  equals  contact-form-main
Enable "Wait for Tags": Yes (if the form redirects immediately after submit)

Enabling "Wait for Tags" matters specifically when a form redirects to a thank-you page right after submission, without it, the page can navigate away before your tracking tag actually fires, silently losing the conversion.

Recipe 4: Track Video Engagement

For YouTube embeds specifically, GTM has a built-in "YouTube Video" trigger requiring zero custom setup, it automatically listens to the embedded player's API. For self-hosted HTML5 video, you'll need the same trigger type configured against HTML5 video elements, GTM added native support for this alongside the YouTube trigger.

Trigger type: YouTube Video
Capture: Start, Complete, Progress
Progress Range: Percentages
Percentages Thresholds: 25, 50, 75

Verifying Every Recipe With Preview Mode

Before publishing any container change, click Preview in GTM, this opens your site connected to a debug panel showing every tag that fires, every variable's value, and every trigger that did or didn't activate on each interaction. Test the actual action, the click, the scroll, the form submit, and confirm the expected tag fired with the expected values in the Summary panel before publishing to your live container.

Common Mistakes

• Publishing without testing in Preview first. A trigger condition with a typo in a class name fails silently, no error, just a tag that never fires, Preview is the only way to catch this before it costs you weeks of missing data.
• Using "All Elements" clicks when "Just Links" would be more precise. All Elements triggers evaluate every click on the page against your condition, which is more processing overhead and a wider surface for an accidental match than necessary.
• Forgetting "Wait for Tags" on forms that redirect immediately. This is the single most common reason a form submission tag looks correctly configured in Preview but never fires in production on a real, fast-redirecting form.

Frequently Asked Questions

Do I need to know JavaScript to use these recipes?

No, all four use GTM's built-in trigger types and variables, no custom HTML or JavaScript tags required for the setups shown here.

How do I find the right CSS class or ID to target?

Right-click the element in your browser and choose "Inspect," the class or ID attribute shown in the HTML is what you enter into the trigger's condition field.

Why does my trigger work in Preview but not on the live site?

Confirm the container was actually published after testing, changes verified in Preview don't go live until you click Submit and Publish, a surprisingly common gap between testing and deployment.

These four recipes cover the majority of tracking needs most sites have, but a container with dozens of tags accumulated over years often has conflicting triggers, duplicate tags, or dead tracking nobody's checked in a long time. If you want your GTM container audited and cleaned up, or these recipes built correctly for your specific site, our GTM Setup team can handle it.