Setup Click Event Tracking in Google Analytics

Google Analytics is a free online tool offered by Google for recording and analyzing website traffic. Many websites use Google Analytics to keep track of its users. It also help website owner to learn more about kind of users interacting with the website with a categorization of users by following metrics:

• Demographics (Age & Gender)
• User Interest
• Language and Location
• Behaviour
• Technology
• Devices/Platform/OS Used

Google Analytics provide basic information about user visits, page-views, bounce rate and sessions. But if you want to track some specific kind of user interaction with your website then you need to Setup Event Tracking in Google Analytics for on your website. In this post you will get to learn how you can setup Event Tracking and Goals in Google Analytics.

We will be focusing on Click Event Tracking in this blog post and will learn about other kinds of user interaction tracking in the our next post.

In order to tracking a click event for your website, you need to first have Google Analytics tracking code on your website. Most websites are used older version of Google Analytics tracking code i.e. analytics.js and not the most recent version of Google tracking code i.e. Universal Tracking Code (gtag.js). So, we will discussing how you can implement Google Event tracking for code kind of tracking of code.

Before making event tracking code for Click Events, we need to do Goal setup in the Google Analytics. So, here are the steps for implementation of the same.

• Login in to Google Analytics (Visit www.google.com/analytics).
• Then traverse to "Admin" panel and click on "Goals".
• Now click on "New Goal" button.
• Under "Goal Setup", select "Custom" and click on "Continue".
• In "Goal Description", give a name to your Goal and select "Event" for "Type" field before clicking "Continue".
• Under "Goal Details" section, provide values for Category, Action, Label and Value fields. Category and Action fields are compulsory where as Label and Value fields are optional.

For Example, you want to track a click event for a link in the popup appearing on a website. You can use following values for that:
Category: Popup Link
Action: click
Label: Click Tracking 
Event: Leave it Blank

• Once you have populated the fields, simply click on "Save" and your are done with goal creation in Google Analytics.

Now, let us first discuss how you can implement Click Event Tracking for analytics.js which uses "ga() function".

The analytics.js uses ga() function in Google Tracking code. We need to call ga() function from "onClick" function for tracking all click events. The basic code for onClick function to track click events is:

onClick="ga(‘send’, ‘event’, ‘eventCategory’: 'Popup Link', ‘eventAction’: 'click', ‘eventLabel’: 'Click Tracking');"

or

onClick="ga('send', 'event', 'Popup Link', 'click', 'Click Tracking');"

Now you can out this code in href link code for a link "www.abc.com" as shown below:

<a href="https://www.abc.com" onClick="ga('send', 'event', 'Popup Link', 'click', 'Click Tracking');">www.abc.com</a

Now, if your website is using Universal tracking code that has gtag() function in it then you should use following code:

onClick="gtag('event', 'click', {'event_category': 'Popup Link', 'event_label': 'Click Tracking'});"

This code can be implemented for the popup link as shown below:


<a href="https://www.abc.com" onClick="gtag('event', 'click', {'event_category': 'Popup Link', 'event_label': 'Click Tracking'});">www.abc.com</a>

After implementing the code, you can check if the code is working by visiting the "Real-Time" section of the Google Analytics. Go to "Conversions" tab and once you click on "www.abc.com" link in the popup, an activity will vbe recorded under conversions tab.

Later you can check history of all click events in Overview under "Conversions" section of Google Analytics.

If you have any problem in implementing the same, please leave a comment so that I can help you in successful implementation of the same.