Simply tracking the number of visitors on your website or the total number of CTA clicks from your website is not enough. It does not provide you with enough information for you to be able to make optimisation decisions.
For instance, if you have CTAs on multiple pages or locations and you want to see which ones are leading to the most conversions, you need to have custom events set up in Google Analytics 4. With Google Tag Manager you can easily track custom events like button clicks, contact form submissions, newsletter sign ups, file downloads etc in GA4.
Although you can track custom events by implementing some extra code, the easiest way to do so is using Google Tag Manager (GTM).
Let’s start by seeing how to set up Google Tag Manager. If you have set it up already you can skip and move on to the next section.
Setting Up Google Tag Manager
Step 1: Sign Up and Create Account
Once you’ve completed the sign up on Google Tag Manager – you’ll be presented with this screen. Click on Create Account to add your website.
Input your Account Name, Container Name and then select Web under target platform.
Step 2: Install the GTM Code to your website’s <head> and <body> Section
Once you’ve agreed to the terms and conditions, you’ll be asked to install Google Tag Manager Code inside your website’s <head> and <body> tag. You can use plugins like Header, Footer and Post Injections on WordPress to implement this code. If you don’t know how to do it, you can ask your developer to implement the code for you.
Step 3: Set up a GA4 Configuration Tag
To set up a GA4 Configuration Tag, under Workspace, click on Tags in the left Navigation.
Click on the New Button to create a new Tag. Give the Tag a Name (I Prefer to call it GA4 Configuration).
Click on Tag Configuration -> Select Google Analytics: GA4 Configuration from the list -> Enter your Measurement ID.
Note: You can find your GA4 Measurement ID in Google Analytics -> Admin -> Data Streams -> Select Data Stream.
Click on Triggering -> Select All Pages as the Trigger
Click on Save Tag.
You’re done setting up GTM. Now we can go ahead and start creating triggers and tags to capture custom events like button clicks, newsletter sign ups etc.
Track a Custom Button Click Event in GA4 using Google Tag Manager
Now that you’ve set up Google Tag Manager, you can start tracking custom events. For the purpose of this tutorial, I will set up tracking for Keyword Analysis & SEO Report button click on my SEO Resources Page.
Step 1: Configure Click Variables in GTM
Go to Variables in Google Tag Manager, click on Configure and enable all the Built-In Variables under Clicks.
Step 2: Set up a Click Trigger
Go to Triggers in the left hand navigation, click on New. Give the Trigger a name (Call it All Clicks for now).
Click on Trigger Configuration and then select All Elements under Clicks and save the trigger.
This step helps you identify which of the Built-In Variables you can use to track the button click.
Step 3: Identify the Built-In Variable to use.
Click on the Preview Button in the top right corner. In the Window that opens, enter the URL of the Page that has the button you want to track and click on Connect. In my case, it is the Resources Page (https://www.blog.nimitkapoor.com/resources/)
Your website open in a new window. With Google Tag Manager Connected, just click on the button that you want to track and then close the window. The Tag Assistant window will then show a summary of everything that you did on your website.
Go to Click, open the Variables tab and spot the unique variables that you can use to identify the button. For me it is Click Text and/or Click URL. These two variable values will always be different for different buttons in my case.
I’ll be using Click Text and Click URL to track the downloads of my FREE Keyword Analysis & SEO Report.
Step 4: Edit Click Trigger to Fire only when Conditions are met
Now we need to edit the Click Trigger that we set up in Step 2 to fire only when are conditions are met. Go to the Trigger section and select the Trigger that you set up before.
Rename the Trigger from All Clicks to something that you can easily understand (I’ll call mine – Keyword Research Report Click).
Instead of All Clicks, select Some Clicks and then set up the conditions. For me it’ll be Click Text and Click URL. You can even set up just one condition.
Once you’re done, click on Save.
Step 5: Create a New Tag to track Button Click
Click on New, Give the Tag a new Name (I’ll call it Keyword Research Report Click Tag).
Click on Tag Configuration and select Google Analytics: GA4 Event.
From the Configuration Tag dropdown, select the GA4 Configuration Tag that you created earlier. Give the event a name (this is what will appear in GA4 Events Report). So give it a unique name. I’ll call mine keyword_research_report_click.
Sending just a Custom Event is not enough. I reuse this button on a lot of pages. So with this event, I’ll also want to know which page the user was on when they clicked this button. So I can use Page Path as event parameter while setting up the Tag.
You can give this event parameter any name that you want.
Under Triggering, select the Trigger that you just created in Step 4.
Once you’re done, click Save.
Step 6: Check if the Tag is Setup Correctly
Go to Preview Mode again, enter the URL of the Page where the button is. Click on the button and then in the summary, select clicks and check if your newly created Tag was fired.
Step 7: Check in GA4 DebugView to see if the custom event is being tracked properly
To go to the DebugView in Google Analytics, open GA4, click on Configure and then select DebugView.
You’ll be able to see if your custom event is being tracked.
Note: You will see your custom parameters in Real-time reports and DebugView in GA4, but you will not be able to see them in other GA4 reports. You’ll have to register those custom parameters as custom dimensions.
Step 8: Register Custom Dimension in GA4
Go to Configure in GA4, then Custom Definitions.
Click on Create Custom Definitions and fill in the fields. You can give it any descriptive name that you want. I’ll just call it Page Path. In the Event Parameters field, put in the exact value that you put while setting up the Tag in Google Tag Manager.
Click on Save.
Step 9: Submit your Changes in Google Tag Manager
You’re all done now. All you need to do is go back to Google Tag Manager and click on Submit to publish all the things that you’ve set up.
Give your Version a Name and Description so you can easily identify what changes you made and then click on Publish.
You will soon start seeing the new data come in all the reports in GA4.
One Response
Helpful content with step-by-by guide.
Thank you for sharing it.