Software Development Blog

How to track user’ clicks on the website’ buttons and links?

Let’s play a game!

Imagine, you have a huge e-commerce store, or online catalog, or website portfolio. Things are going very well, every day hundreds (or even thousands) users visit your website, spent some time and then left, without any conversion action. What should you need to do, or change in order to return those visitors and to track their online behavior in the future?

The general action plan included a huge list of steps, including all of the marketing strategy aspect

But right now you still might become close friends with Miss Analytics of your website.

The common problem encounters one of the latest clients of LaSoft IT company – Protective Acquisition. You can check them at

The Protective Acquisition is a portal with the Physical Security Products catalog, created to vendors and buyers. Protective Aquisition is a multifunctional platform, that includes:

  • A central hub for all stakeholders (owners, architects, engineers, contractors, consultants, and vendors) who participate in the security building and infrastructure construction industries.  A place where all involved can save time identifying the products which meet their specific project requirements, or – if a vendor – a single place where their potential customers can search for and find their products, based on specific project needs.   
  • This will save time (and therefore money) for Vendors as it will cut downtime on long and often fruitless searches.
  • This will save time (and therefore money) for vendors as queries from Vendors will come as ‘pre-vetted’.  That is, they will not be uninformed calls asking very basic questions about products. The Vendors will have already been able to select by their specific criteria they will only be calling about products that meet their needs.

What did we do in order to provide extensive analytical data of user’s behavior, including visitor’s detailed action, such as clicks and link clicks on all of the elements of the website, including clicks on the website’s vendors? 

The whole plan consists of three steps, as well as the name of the platforms that we had used:

  1. Google Tag Manager that delivers simple, reliable, easily integrated tag management solutions.
  2. Google Analytics that tracks and reports website traffic, currently as a platform inside the Google Marketing Platform brand. 
  3. Hotjar that visualize what users want, care about and do on your site by visually representing their clicks, taps and scrolling behavior – which are the strongest indicators of visitor motivation and desire.

In the first step, we created an account on Google Tage Manager, published a GTM container and implemented the GTM code on the website. On that step,  you obviously will need some strong developers to help, but only with the implementation of GTM code on the <head> of your page, that’s all!

After the following steps we’re able to create four tags in the GTM container, that will become base in the analytics of the website.

Tag #1: GA – Click.

That tag is able to track all of the user’s clicks on the website elements.

He was created by using default GTM trigger – Click, that enables manually,  and two GTM variables – Page Path and Click Text:

Tag #2: GA – LinkClick.

That tag is tracking the user’s click on all of the active URLs on the website. It’s really useful when you have a lot of pdf documents and other downloadable links, or all of the different types of vendors (as in our case) on the eCommerce store.

He’s using default GTM trigger – Link Click that enables manually, and two GTM variables – Page Path and Click URL.

Tag #3: GA – MainTracking.

That tag is the basic of the GTM container and is able to track a user’s presence on the website via the GA account, including default indicators, such as page views, avg. time on page, bounce rate,  number of sessions, type of the channel, custom events and conversions, ad campaigns, site speed, etc, etc.

He’s using default GTM trigger – All pages, that enables manually and GA ID as a custom  variable: 

Tag #4: Misc – Hotjar.

The last tag in the GTM container is tracking the user’s behavior on the website by using the heatmap that was developed by the Hotjar platform.

He’s using default GTM trigger – All pages, that enables manually, and Hotjar ID, as a custom variable:

The following tags created in order to track user’s behavior on the website, as unique events.

All of them are displaying in the brand-new GA account of the Protective Acquisition website.

In the behavior section, under Events — Top events, we are able to track specific user’s actions, including clicks and link clicks on a custom page of the website.

By pressing the Save report button in the GA account we’re saving a lot of time and effort. As the next time, we can just click on the customization section and in the saved reports we’ll see all of the necessary information up to the vendor’s segmentation.

We just need to choose the correct time in the date section of GA account and easily access to the specific user’s action by a website page, or vendor’s name:

In the Hotjar account of the Protective Acquisition website, we are seeing the heatmap of the user’s click on the website’s elements. That’s an unreplaceable resource of really useful information not just for the analytics department, but also for the design team. With active heatmaps, product designers are able to analyze the user’s journey from the first click up to the exit page. With that being said, on the future projects and on the improvements version of that one UI-UX designers are able to improve page’s design with more understandable and trustworthy design for further customer’s goal conversions. 

Under the recordings section, we are able to track users’ behavior and inspect the whole session from the first website visits up to the bounce rate pages. Hotjar collects user’s sessions in the form of short but informative videos that display the customer’s journey. Those recordings are the most beneficial way of searching and improving website bags and fixing them on the live version of the project.

With that being said, Google Analytics, Google Tag Manager, and Hotjar are extremely important resources in the complicated marketing strategy of the eCommerce store or SPA website, as an irreplaceable source of useful data about the user’s behavior of the project and customer’s journey in general.

Please share in the comments below the TOP-3 resources, and tags that you are using in order to track user’s activity on your own website.

2 comments On How to track user’ clicks on the website’ buttons and links?

Comments are closed.

Welcome to check our projects

We have described the most compelling solutions and approaches to meet challenges and advantages.

Share This