A simple way to detect rage clicks with Hotjar

‍

In this article, we’ll show you how to filter out and detect rage clicks with Hotjar. Rage clicks can be a sign that the site has some major usability issues and it would be advisable to fix them. We will show you how you can enable this on your website and start tagging them in Hotjar.

As Conversion Rate Specialists we focus a lot on data acquired through our conversion optimization research in order to improve your conversion rate. Here at Polaris Growth, we consider Hotjar (website) one of the tools we love to use the most while doing our conversion optimization research.
Besides the standard functionalities, Hotjar has some really cool features. For example, using JavaScript to tag recordings is a feature we regularly use to autotag each variation of an A/B experiment.

What we found to be missing in Hotjar in the past was the ability to detect and tag sessions with rage clicks. It has now been implemented but only for the business plans so I was thinking of a way we could add this functionality using the Hotjar JavaScript feature. As it turns out there is a simple way to detect and tag rage clicks in Hotjar.

Actually this method allows you to do much more than just add tags to a recording. Once you detect the action is taking place you can alter the code here to fire any other events or actions you want. Send it to GA? Add an event in Klaviyo? You name it...

Rage Clicks

But first, what is are rage clicks?
Let me give you a short illustration:

1. You arrive on a page,
2. you see some great things you want to read, signup for or buy
3. you click on the link or a button
4. and then nothing happens…
   

1. you wait… click again.. nothing happens.. click…. click.. click. click click click… Darn it… the site is broken!
2. now I’m frustrated and or angry.
   

Or as inspectlet says:

“Rage Clicks identify moments of frustration by users, usually caused by excessive clicking in areas without triggering any UI changes. Common points of user rage include clicking on dead links (text that looks like a link but isn’t), clicking on images hoping to enlarge them (unsuccessfully) and other points of UI confusion. “

This is something you don’t want to happen on your site, but if it does happen and people are getting frustrated, you actually want to know about it. We created a script which you can easily load on your site and it will auto detect rage clicks and it also tags them in Hotjar. (A big thanks to Gursimran for his help on this)

‍

How does it work?

1. Simply add the script below to the head section of your website
2. Change the following variables as you see fit to fine tune when you want the tag to be sent to a Hotjar recording.
   no_of_clicks (amount of clicks) and time (seconds)

Here is the script:

‍

Using Google Tag Manager (GTM)?

You can also load this with GTM on your site by adding the following code as custom HTML tag.
Instead of sending a tag to Hotjar we now push a new event to the dataLayer ( dataLayer.push({“event”: “rage-clicks-detected”}); ) which we can now use to have some fun in GTM and fire additional things.

‍

Add a Custom HTML tag in GTM and add the code

Create a new trigger

Add a Custom HTML tag to send the rage clicks detected tag to hotjar

What else can we do?

With the event now being present in the dataLayer you can do some other useful thinks like:

• sending an event to Google Analytics,
• Initiate a Hotjar Poll (https://help.hotjar.com/hc/en-us/articles/115015712548-Using-JavaScript-Triggers-to-Start-Recordings) asking people for insights on the problem they are having or
• to initiate a chat if you have a chat feature on your site.

See below an example for “How to initiate a Hotjar poll”

Initiate a “Rage Click” triggered Hotjar Poll

In order for this to work you first need to add a new poll which only triggers based upon a javascript variable. In this case we named this trigger “Rageclick”.

You can also include additional url’s or exclude url’s if you need to finetune where this poll can be triggered.

Next add this custom HTML tag to GTM

‍

Add a custom HTML tag

Conclusion

As a conclusion, you can now use Hotjar to easily detect rage clicks if you add this script or until they implement this feature.
We hope that after reading this you will use this feature more often and it makes detecting rage clicks on your sites easier. If you have any question, please do not hesitate to contact us. Again a big thanks to Gursimran for his help on creating the script. If you found an error or have an idea on how to improve this further, let us know!

‍