GA4 Event Tracking Without Writing Code: The GTM Visual Guide

GA4's enhanced measurement handles the basics — page views, scrolls, outbound clicks. But what about tracking specific button clicks, form submissions, video plays, or CTA interactions? Most guides tell you to write JavaScript. You don't need to.

Google Tag Manager's built-in click tracking, form tracking, and visibility triggers let you set up custom GA4 events without touching your site's code. Here's the complete visual guide.

Step 1: Enable Built-In Variables

Before creating any triggers, enable the click-related built-in variables in GTM:

1. Go to Variables → Configure in GTM
2. Under Clicks, enable: Click Element, Click Classes, Click ID, Click URL, Click Text
3. Under Forms, enable: Form Element, Form Classes, Form ID, Form URL, Form Text
4. Under Visibility, enable: Percent Visible, On-Screen Duration

These variables capture information about every click and form interaction — you'll use them to create targeted triggers.

Step 2: Track a Button Click

Let's say you want to track clicks on your "Start Free Trial" button.

Create the Trigger:

1. Go to Triggers → New
2. Choose Click — All Elements
3. Set to "Some Clicks" and configure the condition: Click Text contains Start Free Trial
4. Alternatively, use Click ID or Click Classes for more precision

Create the GA4 Event Tag:

1. Go to Tags → New → Google Analytics: GA4 Event
2. Select your GA4 Configuration tag
3. Event Name: cta_click
4. Add event parameters: button_text = {{Click Text}}, page_location = {{Page URL}}
5. Set the trigger to your button click trigger

Step 3: Track Form Submissions

Form tracking catches leads, contact form completions, and newsletter signups.

1. Create a trigger: Form Submission
2. Enable "Wait for Tags" and "Check Validation"
3. Filter by Form ID or Form Classes to target specific forms
4. Create a GA4 event tag with event name form_submit and parameters for form_id and form_destination

Pro tip: "Check Validation" ensures the trigger only fires on valid submissions, not on attempts where the browser blocks submission due to required fields.

Step 4: Track Scroll Depth (Beyond 90%)

GA4's enhanced measurement tracks scroll at 90% only. For more granular data:

1. Disable the built-in scroll tracking in Enhanced Measurement
2. Create a Scroll Depth trigger in GTM
3. Set thresholds at 25%, 50%, 75%, and 100%
4. Create a GA4 event tag with event name scroll and parameter percent_scrolled = {{Scroll Depth Threshold}}

Step 5: Track Element Visibility

Want to know if users actually see your pricing section? Use element visibility triggers:

1. Create a trigger: Element Visibility
2. Selection method: CSS Selector (e.g., #pricing-section)
3. Set minimum percent visible: 50%
4. Fire on: "Once per page"
5. Create a GA4 event: section_view with parameter section_name = pricing

Event Naming Best Practices

GA4 is strict about event naming. Follow these rules:

• Use snake_case: cta_click, not CTA Click or ctaClick
• Don't use reserved prefixes: ga_, google_, firebase_
• Max 40 characters for event names, 40 for parameter names, 100 for values
• Max 500 distinct event names per property
• Register important parameters as custom dimensions in GA4