About Universal Analytics

This page is showing example of how to setup Universal Analytics for learning purpose, please be aware the Google Universal Analytics will no longer process new data beginning July 1, 2023. You'll have to switch to Google Analytics 4 Property.

Why use dataLayer for GA4?

GA4 has different ways to fire events. Enhanced measurement events, which is build in events that will enable by options, then Recommended events, these events won't send automatically but will require some configuration or manual setup. Now, if the events you want to fire are not both of these scenario, you can create custom events and send to GA4. You can use gtag or dataLayer to send custom events.

This blog will focus and demo how to use dataLayer to fire custom events to GA4.

Pre Requirement

This blog assume following task are already done on your site.

• You have google tag manager already configure for GA4.
• Your web site had load above GTM.
• Your Google Analytics had link to Big Query.

Goal

The goal we're trying to do is fire following dataLayer events, assume you have contact form at home page, you would like to try this data at GA4. For testing purpose we'll fire below events at console, but once we fire the events, we'll see how does it show at the browser, how to see events at GA4 UI and hwo data flow into Big Query.

// we wan't to fire this event when the user click the submit contact form button.
dataLayer.push({"event" : "contact_lead", "email": "test@test.com", "page": "home"});

If you just run the above Javascript at console, nothing will happen until you finish following setup at GTM.

Create Triggers at GTM

At GTM, click Triggers > Custom Events, and enter the event name as contact_lead.

Create DataLayer Variable

If you look at the above dataLayer, you can see there are two fields, email and page. We'll need to configure the dataLayer variable so run above dataLayer will include the email and page fields.

At GTM, click Variables -> User-Defined Variables, create 2 dataLayer variables as below.

Crate Google Analytics GA4 Event

One created Triggers and Variable, we can create a new GA4 Event tag. Click Tags > New > Google Analytics: GA4 Event Here, we'll enter the event name as contact_lead and also 2 more Event Parameters. Now the configuration for run above Javacript code is ready.

Choose the Triggering for GA4 Event

Now, the last part is add the trigger, as when above events should fire, so far we set all the custom events but you can filter to class or id.

Publish or Preview the GTM changes

If you don't want to publish your GTM changes, you can preview and test the setting or just did and see if we can fire the events with GA4.

Verify the code

Run the below code at browser console windows to test.

After run the above code, take a look at the browser network tab, you should see some request start from collect?v=2..., this is GA4 request.

As you can see the GA4 request include the email and page's key and value, without the GTM setup, you won't see this request fire, without the dataLayer variables you won't see the email and page include to the payload either.

You can test by running following javascript code at console, so if the GA4 will include this data or not, which it will not include unless you configure the datalayer variable data1 at GTM.

dataLayer.push({"event" : "contact_lead", "email": "test@test.com", "page": "home", "data1": "other data"});

Verify at GA4 UI

You can verify the event by go to the GA4's realtime section and check the section for events, as you can see our contact_lead displays at the page, and you will see the email and page's key and value as well.

How about the Big Query?

If you connect the GA4 with Big Query, you should see the something analytics_111111 and there's events_intraday_, that intraday will be a stream data coming from GA4, and you can see our contact_lead is writing to this table.

Conclusion

GA4 provide dataLayer and gtag to fire custom events, if using dataLayer you will have to configure trigger and events at GTM, if follow the correct steps should be able to configure quick, but lots of configuration at GTM might not suitable for certain company's requirements.