GA4 Event Tracking Setup: A Beginner’s Tutorial with Real Examples

GA4 Event Tracking Setup: A Beginner’s Tutorial with Real Examples

If you just opened your Google Analytics 4 property and you’re wondering how to actually track what users do on your website, you’re in the right place. In this tutorial, we walk you through a complete GA4 event tracking setup from scratch, with real examples for button clicks, form submissions, and scroll tracking. No fluff, no theory dumps, just what you need to get data flowing today.

By the end of this guide, you’ll be able to create custom events, verify them in real time, and avoid the most common mistakes that break tracking silently in the background.

What Is an Event in GA4?

In Google Analytics 4, every user interaction is an event. A page view is an event. A click is an event. A video play is an event. This is different from Universal Analytics, where you had a mix of hits, pageviews, and events.

GA4 uses four event categories:

• Automatically collected events: sent by default (first_visit, session_start, etc.)
• Enhanced measurement events: toggled on in the data stream (scrolls, outbound clicks, file downloads, video)
• Recommended events: predefined names Google suggests for common actions like login, sign_up, purchase
• Custom events: events you define yourself for anything specific to your business

Before You Start: Prerequisites

Make sure you have these ready before diving into the setup:

1. A GA4 property created and connected to your website
2. The Google tag (gtag.js) installed, or Google Tag Manager (GTM) container deployed
3. Admin or Editor access to your GA4 property
4. The GA4 DebugView open in a second tab (Admin > DebugView)
5. The Google Tag Assistant browser extension installed

Step 1: Enable Enhanced Measurement (Free Wins)

Before writing a single line of code, turn on Enhanced Measurement. This gives you scroll tracking, outbound clicks, site search, video engagement, and file downloads without any custom work.

How to enable it

1. Go to Admin in the bottom left of GA4
2. Under Data collection and modification, click Data streams
3. Select your web stream
4. Toggle Enhanced measurement to ON
5. Click the gear icon to choose which events you want (scroll, outbound clicks, site search, form interactions, video, file downloads)

Tip: The default scroll event fires at 90% page depth only. If you need 25%, 50%, or 75% thresholds, you’ll need a custom scroll event via GTM (covered below).

Step 2: Track a Button Click (Custom Event via GTM)

Let’s say you want to track clicks on your “Request a Demo” button. Here’s how to set it up in Google Tag Manager.

2.1 Enable click variables in GTM

1. Open your GTM container
2. Go to Variables > Configure
3. Check all built-in variables under the Clicks section (Click Element, Click Classes, Click ID, Click Text, Click URL)

2.2 Create a trigger

1. Go to Triggers > New
2. Trigger type: Click – All Elements
3. Fires on: Some Clicks
4. Condition: Click Text equals Request a Demo (or use Click ID / Click Classes for reliability)
5. Name it: Click - Request Demo Button

2.3 Create the GA4 event tag

1. Go to Tags > New
2. Tag type: Google Analytics: GA4 Event
3. Measurement ID: your GA4 ID (starts with G-)
4. Event Name: demo_request_click
5. Add parameters if useful: button_text = {{Click Text}}, page_location = {{Page URL}}
6. Attach the trigger from step 2.2
7. Save and click Preview to test

Step 3: Track a Form Submission

Form tracking is one of the trickiest parts of GA4 event tracking setup. GA4’s Enhanced Measurement includes a form_submit event, but it only fires when the form actually submits through a standard HTML form event, which many modern frameworks bypass.

Option A: Use Enhanced Measurement (easy but unreliable)

Toggle Form interactions ON in your data stream settings. Works for basic HTML forms.

Option B: Use a GTM Form Submission trigger

1. In GTM, create a new trigger of type Form Submission
2. Check Wait for Tags and Check Validation
3. Filter by Form ID or Page Path so you only fire on the correct form
4. Create a GA4 Event tag with event name generate_lead (a recommended event name)
5. Add parameters like form_id, form_destination, and any lead value

Option C: Data Layer push (most reliable)

Ask your developer to push an event to the data layer after a successful submission:

window.dataLayer = window.dataLayer || [];
dataLayer.push({
  'event': 'form_submitted',
  'form_name': 'contact_us',
  'form_location': 'footer'
});

Then create a Custom Event trigger in GTM listening for form_submitted.

Step 4: Scroll Tracking with Custom Depths

The default 90% scroll from Enhanced Measurement isn’t granular enough for most content sites. Here’s how to track 25%, 50%, 75%, and 100%.

1. Disable the default scroll in Enhanced Measurement (to avoid duplicates)
2. In GTM, create a trigger: Scroll Depth
3. Vertical Scroll Depths (Percentages): 25, 50, 75, 100
4. Fire on: All Pages
5. Create a GA4 Event tag with event name scroll_depth
6. Add parameter percent_scrolled = {{Scroll Depth Threshold}}

Step 5: Register Custom Parameters as Custom Dimensions

This is where most beginners lose their data. If you send a custom parameter like button_text, GA4 will NOT show it in reports unless you register it as a custom dimension.

1. In GA4, go to Admin > Custom definitions
2. Click Create custom dimension
3. Dimension name: Button Text
4. Scope: Event
5. Event parameter: button_text (must match exactly)
6. Save

Note: Data starts collecting from the moment you register the dimension. Historical parameter values won’t appear.

Step 6: Verify Everything in DebugView

Never trust an event until you see it fire in DebugView.

1. Install the Google Tag Assistant Companion extension
2. Enable debug mode on your site (Tag Assistant will do this automatically when connecting)
3. Open GA4 > Admin > DebugView
4. Interact with your site and watch events appear in real time

Common Mistakes to Avoid

Marking Events as Key Events (Conversions)

Since 2024, GA4 renamed “conversions” to key events. To mark an event as important:

1. Go to Admin > Events (under Data display)
2. Find your event in the list (it must have fired at least once)
3. Toggle Mark as key event

Key events are what Google Ads uses for conversion bidding, so make sure you mark only the events that truly matter to your business.

Quick Reference: Event Naming Conventions

• Use lowercase snake_case: video_play, not VideoPlay
• Prefer Google’s recommended event names when possible (they unlock reports)
• Keep parameter names under 40 characters
• Keep parameter values under 100 characters
• You can send up to 25 custom parameters per event

FAQ

How long does it take for events to appear in GA4 reports?

In DebugView, events appear within seconds. In standard reports, it can take 24 to 48 hours for full processing.

Do I need Google Tag Manager for GA4 event tracking?

No, you can use gtag.js directly, but GTM makes custom event setup much easier, especially for non developers, and lets you manage everything without touching the site code.

What’s the difference between a key event and a custom event?

A custom event is any event you create. A key event is any event (custom or standard) that you have marked as important for your business goals, similar to what conversions used to be.

Can I edit or delete events after they’ve been created?

Yes. Go to Admin > Events, where you can modify or create new events based on existing ones. You cannot delete already collected data, but you can stop future collection.

Why does my event show up in DebugView but not in reports?

Most likely you haven’t waited long enough (up to 48 hours), or you’re looking at a report filtered by a dimension you haven’t registered yet.

How many custom events can I have in GA4?

You can have up to 500 distinctly named events per property. Custom parameters are limited to 50 event-scoped and 25 user-scoped custom dimensions per property.

Wrapping Up

A proper GA4 event tracking setup takes maybe an hour for the basics, but it will pay off for years. Start with Enhanced Measurement, layer in custom events through GTM, register your parameters as dimensions, and always verify in DebugView before publishing.

If you get stuck, remember the golden rule: if you can see it in DebugView, it will eventually show in your reports. If you can’t see it in DebugView, no report in the world will save you.

Need help setting up GA4 for your business? The team at TechBuba is here to help. Reach out and we’ll get your analytics stack running the right way.