Google Analytics Events provides an option for tracking almost any user interaction on a website. Although the next generation of Google Analytics called Google Analytics 4 automatically tracks many events, you may still want to track specific links. This blog post will show you how to do just that.
All you really have to do for tracking HTML link clicks is add few lines of code to your Google Analytics tracking code implementation.
Video Tutorial for Tracking Link Clicks Using Google Analytics
Global site tag (gtag.js) – Google Analytics Without Link Tracking Event
Google Analytics Universal Tracking Code With Link Tracking Event
Code to Add to Google Analytics Script
//Code to Track Link Clicks
var CHANGEThisPDFDownloadTracking = function(url) {
gtag('event', 'CHANGEThisOurNewEvent2022', {
'event_category': 'CHANGEThisPDFdownloadlink',
'event_label': url,
'transport_type': 'beacon',
'event_callback': function(){document.location = url;}
});
}
onclick Event Code to Add to Website Link
Finally, for link tracking to work, you must modify the actual link you want to track by adding an onclick JavaScript event.
<a href="https://www.example.com/pdf-download-page/" onclick="PDFDownloadTracking('https://www.example.com/pdf-download-page/'); return false;">Download PDF Now</a>
Better Way to Use Google Analytics in 2022
Google Analytics in 2022 offers you option to use the latest next generation of Google Analytics 4 property [GA4]. The entire event tracking analysis and architecture is different compared to early generation of Universal Tracking analytics.js or gtag.js. Meaning, with [GA4] Events are triggered as users interact with your site or app.
Basically, using GA4 Google Analytics automatically tracks many user interactions without website owners changing their code implementation.
You can use both the latest Google Analytics 4 property AND Universal Analytics. You can accomplish this in 2 different ways.
First option is by Login to Analytics and find Admin settings. And under your GA4 Property Enable Enhanced measurement. Then,
Data Streams > Web stream details > Additional Settings > More tagging settings > Collect Universal Analytics events (Turn On)
Second option is by just inserting your Universal Analytics property id to your current GA4 Tracking Code which will look something like this
gtag('config', 'UA-1234567-1');
What If You Want to Track Different Links & Continue Using Universal Analytics Property?
The above image shows you how you can track multiple links. Simply create a new var for your Events Function. As you can see in the image above, I’ve also added Universal Analytics property id to continue using the previous Universal Analytics property. If you want to just use only the next generation Google Analytics 4 property, then, do not include gtag('config', 'UA-1234567-1');
How to Properly Track Link Clicks in Google Analytics
Keep in mind that the latest Analytics offers you many tools for analyzing your website traffic. To learn more about enhanced measurements, visit how to use gtag.js to send Google Analytics Events.
Above all else, remember, your website is competing in Google Core Web Vitals world, that means, you may considering adding Google Analytics Tracking Code in the Footer section instead of HTML head section. Furthermore, strongly consider grouping and minimizing all loading of JavaScript files.
