Google Tag Manager

How to Track Any Type of Click With Google Tag Manager

by Charlie Weller Updated:
Abstract wooden structure

GTM lets you track clicks on any element of a webpage.

Google Tag Manager working in concert with Google Analytics combine to form an underrated analytical duo. Without too much technical know-how, it’s possible to use the two to track virtually any click a user makes on a website. Beyond that, you can keep track of what’s being clicked, where it’s being clicked, and when the click occurs.

Track clicks on specific links, buttons, images… any click is trackable.

This guide includes instructions on how to set up tracking of the following elements on your website:

Note: If you’re not very familiar with Google Tag Manager and need detailed instructions on setting up triggers and tags, try reading the first example in this post, “Tracking clicks on a specific link” first. We get into the most detail in this example, and it should help you learn some of the basics before diving into any of the other examples in the post.

Link tracking

A click on any link on your website can be tracked with GTM, even clicks on broken links. It’s perhaps the most basic type of click tracking you can perform with Google Tag Manager, but once you know how to set up a click trigger for a specific link you should be able to figure out the rest of the click tracking examples laid out in this post.

Create your trigger

  1. Go to “Triggers” and click the “New” button.
  2. Name your trigger. At Pilot we try to stay organized, so we use a consistent naming convention for each type of trigger. For example, all click triggers begin with “Click – …”
  3. Select “Click > Just Links” as the trigger type.
  1. What about “Wait for Tags” and “Check Validation?” If your site doesn’t struggle too much with page speed, you shouldn’t have to worry about waiting for tags. As for checking validation, you shouldn’t have to worry about enabling this if your links are all working properly.
  2. Select “This trigger fires on Some Link Clicks”
  3. For the firing conditions, use the Click URL variable, and input a pattern that matches the URL for which you want to track clicks. If you want one specific URL, use “equals.” If you want to track a collection of links (like all clicks to the blog), you can use “begins with” or “contains” or even a regular expression to match your concerned URL clicks.
Our trigger is set to fire when a user clicks any link to our About page.
  1. Use the “+” if you’d like additional conditions on your trigger. For example, you could use the Page Path variable to track clicks to a specific page from a specific page.
  2. Click the “Save” button.

Create your tag

  1. Go to “Tags” and click the “New” button.
  2. Name your tag. Our naming convention for tags is to include the type of tag. For example, all Google Analytics tags begin with “GA – …”
  3. Click into the “Triggering” section at the bottom of the page and select the trigger you just made.
  4. Click “Tag Configuration > Google Analytics: Universal Analytics”
  5. Select Event as the “Track Type” — this will create an Event in Google Analytics when our URL in question is clicked.
  6. For the Event Tracking Parameters, it really depends on what information you want to pass to Analytics, and how you want it to be organized. The “Category” field is best used to organize your different types of Events. For this example, let’s enter “Link Clicks” as the Event Category so that we can view all of our different link click data in one spot in Google Analytics.
  7. For the Action, enter {{Click URL}} 
  8. For the Label, enter {{Page Path}}. This will allow you to tie the two data points together inside of Google Analytics: 1.) the URL that was clicked, and 2.) the URL the user was on when they clicked.
  9. In “Google Analytics Settings,” add your Google Analytics account’s GA Variable. This is your unique 10 digit tracking code that begins with “UA–”
  1. Click “Save”
  2. Click “Preview” to use GTM’s debugging mode to test whether your tag is indeed firing properly. If so, click “Submit” and publish your new container.

If you want to track clicks on a specific external link, use the instructions above. If you want to track clicks on all external links, you will have to make a change to Step 6 in the trigger creation section. Instead of including specific URL patterns, you can exclude your own domain to effectively target all external links.

Of course, you should also change the trigger, tag, and Event Category names as well to keep your Analytics and Tag Manager accounts organized.

Contact Points

Tracking email address clicks

If users clicking links to send you emails is an important action on your website, you’ll want to make sure you’re tracking these actions in your Google Analytics account. An HTML email link is typically written like this: “mailto:info@pilotdigital.com.”

The steps below will show you how to track clicks on links like these, and how to log which email addresses were clicked and from which pages.

Create your trigger

  1. Create and name a new trigger.
  2. Select “Click > Just Links” as the trigger type.
  3. Don’t worry about ticking “Wait for Tags” and “Check Validation.”
  4. Select “This trigger fires on Some Link Clicks”
  5. For the firing conditions, use the Click URL variable. Since we want to track email address clicks, use “starts with mailto:” for the rest of your firing conditions. HTML email address links are written like this: “mailto:info@pilotdigital.com” and our new trigger will fire when a link like this is clicked.
Our trigger is set to fire when a user clicks a mailto: link.
  1. Use the “+” if you’d like additional conditions on your trigger. For example, you could use the Page Path variable to track email links from a specific page, like your contact page.
  2. Click the “Save” button.

Create your tag

  1. Create and name a new tag.
  2. Click into the “Triggering” section at the bottom of the page and select the trigger you just made.
  3. Click “Tag Configuration > Google Analytics: Universal Analytics”
  4. Select Event as the “Track Type” — this will create an Event in Google Analytics when our URL in question is clicked.
  5. For the Event Tracking Parameters, let’s use “Email” as the Event Category.
  6. For the Action, enter {{Click URL}} so that you can log the email address that the user clicked.
  7. For the Label, enter {{Page Path}}. This will let you keep track of which page the user was on when they clicked the email address.
  8. In “Google Analytics Settings,” add your Google Analytics account’s GA Variable. This is your unique 10 digit tracking code that begins with “UA–”
  1. Click “Save”
  2. Click “Preview” to use GTM’s debugging mode to test whether your tag is indeed firing properly when an email address link is clicked. If so, click “Submit” and publish your new container.

Tracking phone number clicks

Just like the email address link tracking above, clicks on phone number links can be an important interaction to monitor on your website. This is especially true if your website drives a lot of phone calls from mobile traffic, where tapping a phone number on a website is often the easiest way to get in touch with a business or organization.

This setup is exactly the same as the email address click tracking above, with one minor change — the link we want to track starts with “tel:” instead of “mailto:”.

Follow the steps in the email address example above, but make the following alteration to Step 5 in the trigger creation section. Instead of using “mailto:” as the Click URL value, we want to use “tel:”.

Interactive Web Elements

Some clicks don’t involve actual links—a button that triggers JavaScript, or an element that reveals a form—and tracking these requires a different setup inside of Google Tag Manager.

Tracking clicks by element ID

The easiest way to track clicks on elements that don’t contain links is to target them by their element ID.

Find your element’s ID

  1. To find an element’s ID, simply right click on the element and use the “Inspect” functionality of your browser.
  1. If you’ve correctly inspected the element in question, look for “id=” in the element’s HTML.
You can see that the search button I would like to track has an id=“sa_submit”
  1. If your element does not have an ID, you can attempt to follow the steps below using the element’s Class, but this may present issues if that Class is used on other elements. Another option is to ask your web developer to add a unique ID to your element.

Create your trigger

  1. Create and name a new trigger.
  2. Select “Click > All Elements” as the trigger type.
  1. Select “This trigger fires on Some Clicks”
  2. For the firing conditions, use the Click ID variable, and input a pattern that matches the Element ID you found using your browser’s inspector.
Our trigger is set to fire when a user clicks an element with id=sa_submit
  1. Use the “+” if you’d like additional conditions on your trigger. For example, you could use the Page Path variable to only track clicks on this element from a specific page.
  2. Click the “Save” button.

Create your tag

  1. Create and name a new tag.
  2. Click into the “Triggering” section at the bottom of the page and select the trigger you just made.
  3. Click “Tag Configuration > Google Analytics: Universal Analytics”
  4. Select Event as the “Track Type” — this will create an Event in Google Analytics when our element is clicked.
  5. For the Event Tracking Parameters, it really depends on what information you want to pass to Analytics, and how you want it to be organized. The “Category” field is best used to organize your different types of Events. For this example, let’s enter “Search Button” as the Event Category so that we can view all of this event’s data in one spot in Google Analytics.
  6. If your element doesn’t have an actual HTML link on it, using {{Click URL}} as the Action won’t actually tell us anything. We’ll just use “Click” as our Action for now, in case there are other Actions we’d like to track under the “Search Button” category in the future.
  7. For the Label, enter {{Page Path}}. This will append to your event which page a user clicked your element from.
  8. In “Google Analytics Settings,” add your Google Analytics account’s GA Variable. This is your unique 10 digit tracking code that begins with “UA–”
  1. Click “Save”
  2. Click “Preview” to use GTM’s debugging mode to test whether your tag is indeed firing properly. If so, click “Submit” and publish your new container.
Posted in Google Tag Manager