Tracking clicks on an image link via Google Tag Manager

Consider the following image link (link in the form of an image):

<a id=”checklist2″ href=”http://www.weplan.com/Worksheets/worksheets.pdf” ><img src=”http://www.book2web.com/images/download-button-blue-300×133.png” /></a>

In order to track clicks on an image link, follow the steps below:

Step-1: Navigate to the web page (in Google Chrome browser) which contains the image link you want to track via GTM

Step-2: Note down the URL of the web page where the image link is embedded.

Step-3: Note down the ‘ID’ attribute of the image link through Google developer console (as explained earlier). If the ‘ID’ attribute is missing, then ask your developer to add one.

Step-4: Navigate to Google Tag Manager and create a new trigger with following similar configurations:

Trigger Name: Check for click on the image download link
Trigger Type: Click – Just links 

Check Validation

1. Enable this trigger when: Page URL equals <<enter the URL of the page where the image link you want to track is embedded>> 

2. This trigger fires on: Click ID equals <<enter the ID of your <a> element>>

If you want to use the ‘id’ attribute of the image tag instead of the ‘id’ attribute of the <a> tag in order to identify your image link:

<a id=”checklist2″ href=”http://www.weplan.com/Worksheets/worksheets.pdf” ><img src=”http://www.book2web.com/images/download-button-blue-300×133.png” /></a> 

<a href=”http://www.weplan.com/Worksheets/worksheets.pdf” ><img id=”checklist2″ src=”http://www.book2web.com/images/downloadbutton-blue-300×133.png” /></a>

then you need to set the ‘Trigger Type’ to ‘Click All Elements’:

In GTM, if you want to track any HTML element other than a link, then you set the ‘Trigger Type’ to
‘Click All Elements’.

Step-5: Create a new tag with following similar configuration which can send clicks on the tracked
image link to Google Analytics as an event:

Tag Name: Send click on the image download link to GA as event
Tag Type: Universal Analytics
Track Type: Event
Category: Downloads via image link
Action: <<enter the name of your event action>>
Label: {{Page Path}}
Non-Interaction Hit: True
Firing Triggers: Check for click on the image download link 

Step-6: Preview and publish your container.

Step-7: Click on the button and test whether the event data is being sent to Google Analytics, via real
time reports:

Tracking clicks on a link via Google Tag Manager

Consider the following link on a web page:

<a id=”checklist” href=”http://www.weplan.com/Worksheets/worksheets.pdf”>Download Wedding Planning Checklist</a>

In order to track clicks on this link, follow the steps below:

Step-1: Navigate to the web page (in Google Chrome browser) which contains the link you want to track via GTM

Step-2: Note down the URL of the web page where the link is embedded.

Step-3: Right-click on the link and select ‘Inspect‘ from the drop-down menu:

You will now see the Google developer console window at the bottom of the page:

Step-4: Note down the value of the ‘id’ attribute of the anchor tag (<a>). In our case, it is ‘checklist’. You will need this ‘id’ later on while setting up triggers in GTM.

Note: If you do not find any ‘id’ attribute for the link, you want to track, then look for the unique class name. If you can’t find a unique class name then ask your developer to add the ‘ID’ attribute with a unique value. Without the ID attribute, you can’t easily track clicks on a link via GTM.

Step-5: Navigate to Google Tag Manager and create a new trigger with following similar configurations:

Trigger Name: Check for click on the download link
Trigger Type: Click – Just links 

Check Validation1. Enable this trigger when: Page URL equals <<enter the URL of the page where the link you want to track is embedded>>
2. This trigger fires on: Click ID equals <<enter the ID of your <a> element>>

Note(1): ‘Check Validation‘ ensures that the trigger fires on a successful link click and not just when a user tries to click the link.
Note(2): ‘Page URL’ is a built-in variable of GTM which returns the URL of a web page.
Note(3): ‘Click ID’ is a built-in variable in GTM which returns the ‘id’ attribute of the link clicked.

Step-6: Create a new tag with following similar configuration which can send clicks on the tracked link to Google Analytics as an event:

Tag Name: Send click on the download link to GA as event
Tag Type: Universal Analytics
Track Type: Event
Category: Downloads via link
Action: <<enter the name of your event action>>
Label: {{Page Path}}
Non-Interaction Hit: True
Firing Triggers: Check for click on the download link

Non-Interaction Hit – Set non-interaction Hit to ‘True’, so that event tracking does not affect the bounce rate of your website.

Step-7: Preview your container to make sure that the new tag fires and it fires only when you click on the targeted link.

Step-8: If everything is working as intended then publish the new version of your container.

Step-9: Click on the link and test whether the event data is being sent to Google Analytics, via real-time reports: