To better invest your marketing dollars, it’s essential to track conversions (or goals) in Google Analytics. A goal tells Google Analytics what we consider a success to be on our website. We can then use this data to make more informed decisions about our marketing strategy.
If lead generation is a goal of your website, then you’ll want to track how often the button on your contact or lead generation forms is clicked. Google Analytics doesn’t track a click on a button out of the box. It’s something we need to configure in Google Tag Manager.
Watch the Video
How to Track a Button Click in Google Analytics Using Google Tag Manager
1. Get Organized
Start by opening three resources: Google Tag Manager, Google Analytics, and your website. This tutorial assumes that you have already installed the Google Tag Manager on your website and that Google Analytics is up and running. If not, start by setting up Google Tag Manager.
2. Enable All Variables
A best practice in Google Tag Manager is to enable all variables. This will ensure that the variable you need in step 3 is ready and waiting for you.
In the left navigation, go to Variables. Click on all of the boxes to enable all.
3. Create a Trigger
Navigate to your Google Tag Manager container and click Trigger in the left navigation. Think of Triggers as your listener. We need to create a Trigger that is going to listen for the desired action. In this case, our desired action is a click on a button.
Next, go to your website and navigate to the form you’d like to track. We need to find something unique about the button on a page that we can hook into with our trigger. To do so, we’ll need to look at the code behind the button. Hover over the button of interest, right-click, and inspect the element.
This is the hard part as what we find that is unique is going to be a little different in each scenario. In general, you are looking for an “id” or a “class”. In this example we see:
<input id="nf-field-10" class="ninja-forms-field nf-element " type="button" value="Submit">
The ID “nf-field-10” is unique to this form and it’ll be our hook.
Now, return to the Trigger in Google Tag Manager. Click New. Name the trigger “Check for Click on Button”. Be specific so if this is your contact form, label it “Check for Click on [Form Name]”.
Click in the box to configure the trigger. Select “All Elements” from the Trigger Type. Under “This trigger fires on”, select “Some Clicks”. Now, select a variable from the dropdown:
We found an “ID” in our inspection so in this case select Click ID. If you found a class instead, then select Click Class.
Set the condition to “Contains”. Copy and paste the ID code into the field. Here's what the Trigger looks like in this example:
4. Create a Tag
Now that we have our Trigger, we can create a Tag. Think of the Tag as the action we want to happen when the Trigger is fired.
In this case, we want to create a Google Analytics event. GA events are actions on our website that we can label.
In the left navigation, go to Tags. Click New. Label the Tag “GA — Form Submission — [Form Name]”. In this example, it’ll be “GA — Form Submission — Contact”.
Click on Tag Configuration. Select “Google Analytics: Universal Analytics”.
Change the dropdown from Pageview to Event.
The Event Tracking Parameters are your choice. These are the labels. A basic convention for this event would be:
Category — Form
Action — Submission
Label — Contact
I can follow this logic on other forms and use the same Category and Actions. Then, I can change the Label to differentiate each event. For example, maybe I have a different form on my Schedule a Demo page and want to have a separate event for that form completion.
Under “Google Analytics Settings” choose your pre-built variable for your Google Analytics code. Leave everything else to the default settings. Here’s the final Tag:
Now, we need to connect the Tag and the Trigger. Do so right below this field by click on Triggering. Select the appropriate Trigger and Save.
We’re ready to publish our work. In the upper right corner, select Publish. Add a descriptive name so you can keep track of your revisions. Something along the lines of “Adding Event Tracking to Contact Form” would be good.
Let’s make sure it’s working. You can do this by using the Preview mode of Google Tag Manager. Here’s more information on that tool.
We can also complete the action on the live website and then check our Real-Time data in Google Analytics.
7. Turn an Event into a Goal
Google Analytics is now recording clicks on a button as an Event. We now need to tell Google Analytics that that particular event is one of our key performance indicators or goals. In Google Analytics, navigate to the Admin screen. Under Views, select Goals. Click + New Goal.
Label the goal. In this example, it might be “Contact Form Completion” and then select Event.
Here’s where the labeling we chose in the Google Tag Manager Trigger comes in. We need to match it here so Google knows what to listen for.
Frequently Asked Questions
What if my event isn't firing?
The most common issue with setting up event tracking on a button via Google Tag Manager is a mistake with the Trigger. Go back to that step and double-check your work. Try hooking into a different part of the button code. In this example, we used the ID. You could instead try the Class.
I’m still stuck. Now what?
That’s where coaching comes into play. If you are a Pathfinder subscriber, schedule a call with your coach to get a second set of eyes on your Google Tag Manager set up. Not a subscriber? Sign up for our guided SEO approach and we can help dial in your Tag Manager account.
Next: Watch this FREE 1-hour Training
Getting Started with Google Analytics 4 and Google Tag Manager