How to Track Clicks on a Link with Google Tag Manager

Last updated on

How many times have you wanted to track clicks on a link in your WordPress sidebar? Perhaps you’re debating the value of even having a sidebar in the first place. But to decide, you need data. How many times did people click on a sidebar link? What was the link? On which page was the link?

The standard Google Analytics code doesn’t tell you this. It gives you pageviews, and a very limited report of navigation. If there aren’t enough hits, it simply won’t generate a report. This tutorial will teach you how to track sidebar clicks in WordPress using the amazing Google Tag manager. You’ll see the reports directly in Google Analytics!

Requirements:

  1. A Google Analytics Account
  2. Google Tag Manager implemented on your site

For this tutorial, I’m going to assume that you’ve already installed Google Tag Manager on your site. I’m also going to use the sidebar as an example of links that you want to track. It’s easy because WordPress uses the “sidebar” class. If you want to track some other clicks on a link type, add a CSS class to it, and follow the instructions below!

Table of Contents:

Step 1: Log in and Create a New Trigger

If you’ve added the Google Tag Manager code on your website, then log into your Workspace and click the “Triggers” link on the left-hand side. Once you’re in the screen, click the “New” button at the top like this:

Create a New Trigger to Track Clicks on a Link

This will open the configuration page for a new trigger. Click the blank space in the middle, and this will open a flyout sidebar on the right-hand side with the set of possible triggers. Under the heading “Click”, choose “Just Links” as shown here:

Just Links Trigger in Google Tag Manager

Next, give your trigger a name. In this example, I’m calling it “Sidebar Clicks”. Near the bottom, you’ll see a radio button set with the heading:

This trigger fires on

Chose the second radio button – “Some Link Clicks” as shown here:

Some Link Clicks Google Tag Manager

Specifying the CSS for Sidebar Links

Over here, we specify the CSS rules that identify the sidebar links. All standard WordPress themes have a sidebar with the “sidebar” class. The Google Tag Manager accepts a syntax that allows us to specify wildcards and in this case, we want to select all elements under “sidebar”.

So the class rule here is:

.sidebar *

As shown in the screenshot above, there’s a section called:

“Fire this trigger when an Event occurs and all of these conditions are true”

Enter the following values to specify the sidebar link:

  1. Choose “Click Element” from the first drop-down box
  2. Choose “matches CSS selector” from the second drop-down box
  3. Enter “.sidebar *” in the third field

Once you’ve entered all this information, you’re done! We’ve set up a trigger to track clicks on a specific type of link. Save your changes to the new trigger. Now we need to create a tag that will go on the page and that will fire when this trigger is activated.

Step 2: Create a Universal Analytics “Event” Tag

If you’ve already set up Google Analytics, then you probably already have a “Universal” tag set up in Tag Manager. By default, the regular analytics tag sends only pageviews to the server. For tracking link clicks, we’re going to send specific events instead – events that show up under the “Behavior” section on the left-hand side of the Google Analytics dashboard.

To get started, go to the “Tags” section in Google Analytics on the left-hand side and click “New” as we did with triggers:

Add New Tag in Google Tag Manager

In the resulting screen, we need to choose the kind of tag – in this case, Universal Analytics. Remember that this is in addition to the existing Universal Analytics tag you have on your site for regular tracking. So you don’t need to modify what you already have.

From the list of flyout tags from the right, choose “Universal Analytics”:

New Universal Analytics Tag

This will create a default Analytics tag that needs to be customized with the following options:

In the “Track Type” drop-down box, choose “Event”

In the “Category” box, give a descriptive name that will be easily recognizable in your Google Analytics screen. I choose “Sidebar Clicks”.

In the “Action” section, type the following:

{{Click URL}}

And in “Label”, type:

{{Page URL}}

This way when you view your reports under the “Sidebar Clicks” event category, you will receive two additional pieces of information – the Action, and the Label. From this, you will be able to determine which link was clicked on the sidebar, and on which page. Useful information if you need to determine which links to keep and which ones to discard!

Here’s a screenshot of the options:

Configure the Event to Track a Click

Finally, in the section called “Triggering” underneath, click the blank space and choose the “Sidebar Clicks” trigger we created in Step 1 as shown here:

Choose Sidebar Clicks Trigger

The trigger to track link clicks is now associated with this Google Analytics tag. Now save your changes and publish them. You can add a short description of your changes for tracking purposes before it goes live.

Step 3: Track Clicks on a Link – Monitoring

You don’t have to do anything else as far as set up goes. Links will be tracked automatically. Now whenever someone clicks a link on your site that has the “sidebar” class above it, Google Analytics will receive an event under the “Sidebar Clicks” category.

You can see this in action here, as on my own website:

Tracking Links with Google Analytics

For the selected duration, I’ve had 19 sidebar clicks. I can go deeper into the report and see which links generated clicks, and from which pages.

Step 4: Extend This to Track Other Link Clicks

The above method is very powerful for all kinds of click tracking. Chances are, you also want to monitor things like navigation clicks, “related posts” clicks – basically any kind of links of whose efficacy you are not sure.

You can see in my screenshot above that I’ve done just that. I’ve created separate link click categories for all important aspects of my site, and I monitor whether they’re generating enough clicks to be worth it. If I find that a particular element isn’t performing as well as I hoped, I just get rid of it.

Welcome to data-based web design. Where we include or remove website elements based on what works, instead of gut feelings, or what feels good to us. Over a period of time, the data you receive will be invaluable in increasing audience engagement, and in reducing your page speed times as you cull non-performing elements from your pages!

Step 5: Exclude Link Clicks for Admins or When Logged In

You’ll often find yourself clicking links as you navigate around your own site. The method above will track those as well. Here’s a way to exclude tracking when logged in using Google Tag Manager!

About Bhagwad Park

I've been writing about web hosting and WordPress tutorials since 2008. I also create tutorials on Linux server administration, and have a ton of experience with web hosting products. Contact me via e-mail!

Speak Your Mind

*