How To Track Button Clicks With Google Tag Manager

Laptop with Google Analytics - Spoonfed SEO

Welcome back everyone. In this weeks Spoonfed SEO guide, we’re going to be taking a look at how you can track button clicks with Google Tag Manager.

I use WordPress for my blog, but the steps I’ll be showing you today will relate to any CMS. As long as you have Google Tag Manager installed, then you can easily follow along below!

For those of you that don’t have Tag Manager installed, you can check out our previous guide on how to install Google Tag Manager with WordPress!

This post comes at pretty good timing as I realised I’m not tracking how many clicks I’m getting on my contact form. So, let’s craic on and show you how to set up tracking on my contact form!

Configure Those Variables

Before we get started; if this is your first time creating a trigger in Google Tag Manager, then you may need to configure the variables so that you can actually set up the trigger for tracking button clicks!

via GIPHY

Don’t look at me like that.. It’s easier than it sounds.

From the workspace screen in Tag Manager, click Variables on the left side menu.

Now click Configure, scroll down until you come across Clicksand go-ahead now and check all the boxes under Clicks.

Great, you’ve just enabled all those sweet, sweet variables! See that wasn’t so bad!

Creating A Tag

So the next step to set up button click tracking is to create a new tag on Tag Manager. This tag is going to be what is registered as an event whenever the button is clicked.

So go ahead and press to create a new tag. Name your tag something easily identifiable. In this case I’m going to name it “Contact Form – Button Click”.

So this event is going to be measurable in Google Analytics. Therefore the tag type is going to be Google Analytics – Universal Analytics. From there we need to set up some Event Tracking Parameters, including the Category, Action and Label.

As you can see from the below screenshot, I’ve labeled the Category as “Contact Form”, the Action as “Button Click” and the Label as “Contact Form Click”. You need these to be easily identifiable as you will be using these parameters if you want to set the event as a goal in Google Analytics.

The last step is matching it with the right Analytics account so just go ahead and select your account in the final box.

Creating a tag in google tag manager

Ok, so now you have created the tag. We just need it to trigger when the button is clicked!

Create A Trigger

This step is where it gets a little more technical and there’s a lot of different methods for setting up the triggers. I’m going to show you what I found to be the easiest method with the most consistent results.

First up, go into Triggers and select add new.

Again, name your trigger something easily identifiable. I’m naming this Contact Form – Button Click Trigger.

Next, configure your trigger! So we want to track a button click. Therefore our trigger is going to be under the Click heading. We’re going to select All Elements.

All click elements - Google Tag manager Spoonfed SEO

Select Some Clicks. Or else you’ll literally be tracking all clicks on the website.

Now this is where you identify the specific elements in the button you want to track. So under the first drop-down, you’re selecting the variable Click Element that we added in at the start of this guide. Under the next drop-down, select Matches CSS Selector.

Google Tag Manager Tag - Some Clicks

Now we’re going to need to find the CSS selector of the specific button we want to track. So head back over to your website, and head to the page with the button.

Now, right click on the button and choose Inspect. Now you’re going to see something similar to this:

Inspect Button - Spoonfed SEO

On that frightful looking code screen, right click the highlighted section, hover over Copy and select Copy Selector, like so:

Copy CSS Selector - Spoonfed SEO

Mighty stuff! You just identified the button with its CSS selector! Now just paste that into the final box back over in Tag Manager and hit save!

Nearly There!

Now, we’re not done yet! As always, if you’re making changes or setting something up on Google Tag Manager, then you need to check to make sure it’s working properly!

So go ahead and hit Preview on Tag Manager and head back over to your site.

Refresh the page and make sure you have the Tag Manager preview screen at the bottom of the page. Now, go ahead and click that button!

If you have followed all of the steps above, then after you click the button you should see the tag firing.

Great job! Now just head back over to Tag Manager, leave preview mode and hit Submit to save your work and publish the new tag!

This button click will now show up in Google Analytics under Behaviour > Events. Don’t worry if you don’t see it straight away, this will take a few hours to show up initially!

So there you have it, another Spoonfed SEO guide: How To Track Button Clicks With Google Tag Manager!

I hope this helped solve your question, if not, feel free to actually click that submit button and get in touch through my contact form! I’d be delighted to help further with anything you need, because that’s what we’re here for.

This is Spoonfed SEO, the beginner friendly SEO blog.

Author: Brian C

Brian is an SEO Manager for a leading Irish digital agency. With years of experience across Social Media Management, Content Development and Strategy and SEO for clients across a diverse portfolio, Brian shares his insights to make digital digestible for everyone.