Hotjar AB Test Implementation - Order of Script Execution

Dear unbounce community!

I am fairly new to unbounce and this is my first post, so please bear with me :slight_smile:

I have enabled our AB Testing for myurl and generated Variant A and Variant B. I learnt that these two URLs are differentiated by the URL extension as myurl/a.html andmyurl/b.html. These URLs, however, are not sent to Hotjar for the Heatmap setup. Hence, I need to work with the Javascript trigger. I also implemented it working fine for my Landing Page. However, I had to place my general Hotjar Tracking code and my snippet code in the Variant Script Manager.
If I want to apply this setup to all my Landing Pages (approx 15 with 2 Variants each) I would generate a lot of manual work.
I read that the execution order of scripts in unbounce is Variant Scripts > Global Scripts. Since the general Hotjar tracking code must be executed prior to the variant specific snippet, I was wondering whether there is any convenient option to make a global script execute prior to all the variant scripts? Like this I would be able to add the global hotjar script once in the script manager and only change minor snippets on a variant level.

Maybe you even have different solutions, how I can work with global variables being sent from the script manager.

Thank you have a great day,

Hey @Team_Vation,

So what’s stopping you from loading the Hotjar tracking code followed by the JS trigger all from the Global Script Manager?

Your JS trigger shouldn’t be page specific anyway.


EDIT: The main Hotjar script needs to be placed in the <HEAD> while the JS trigger should ideally be placed in the <BODY> so the JS trigger has enough time to get the pageID and variantID which you should be using to trigger the heatmap.

Hi Hristian,

thank you very much for your prompt response.

The JS trigger needs to be page specific because I have an individual JS snippet per variant heatmap.

In this post you mentioned the options to adjust the standard hotjar implementation. If I understand correctly I now need to define a JS snippet (e.g. hj('trigger', 'my_lp_1_variant_a');) and post it into my JS for a specific page.

The option of placing the JS trigger (page specific) into the<BODY> instead of the <HEAD> might work. I will check this option.