Skip to main content
All CollectionsAdvanced HelpMarketing
Hotjar Setup including User Attributes
Hotjar Setup including User Attributes

Get Hotjar setup including sending custom user attributes (Identify API)

Niall Diamond avatar
Written by Niall Diamond
Updated over a week ago

Hotjar will record your user sessions and give you a full blow-by-blow replay of what the customer did. Checkout more at https://www.hotjar.com/

Basic Setup

Step 1: Copy the script.

Step 2: Paste it into your Header block

Step 3: Click to verify

That's it! You have now successfully setup Hotjar! πŸŽ‰


User Attributes Overview

User Attributes feature allows you to send user data to Hotjar when a session is being recorded. This way you will be able to see what user's journey was recorded and segment or filter for your logged in customers.

πŸ‘ Important: Make sure that your basic setup is completed (See above) then proceed with this section.

πŸ‘ Requirement: You must have the "User Attributes (Identify API)" feature enabled for your subscription. Check with Hotjar, if you are unsure.

What you can do with the User Attributes (Identify API)

Send user data to Hotjar that can then be used to segment your user session recordings. This allows you to better track and report on your existing customers, separate from guest customers or potential customers.

User information in the Session Recordings

Filter recordings by User attributes and save segments

Where are the User Attributes pulled from?

The user attributes come from the User Profile area.


User attributes setup

πŸ‘ Important: Make sure that your basic setup is complete above then proceed with this part

Step 1: First, check to make sure your "Session capture" is turned on.

Step 2: Add this script to your Theme Options => Footer block

<script>
if ($('body').hasClass('ex-loggedin')) {
var userId = EvoXLayer().user.user_id || null;
let name = () => {
let name = EvoXLayer().user.name;
return name.split(" ");
}

var evoXobj = {
'company name': EvoXLayer().user.company == '' ? null : EvoXLayer().user.company,
'customer id': String(EvoXLayer().user.customer_id),
'email': EvoXLayer().user.email,
'first name': name()[0] == '' ? null : name()[0],
'last name': name().slice(1).join(" ") == '' ? null : name().slice(1).join(" ")
};
window.hj('identify', userId, evoXobj );
console.log('Hotjar Attributes for user ' + userId + ': ', evoXobj);
}
</script>


Testing:

Login to the storefront with one of your customer's or test user accounts. Navigate around the store for a minute or two. This will hopefully get Hotjar to capture this session.

If Hotjar captured the session, you will see the recording show up in your Hotjar dashboard. You will then see the attributes in the video playback. You can also check the below User Attributes section in the Account settings.

Account Settings => User Attributes


Congratulations! Well done you! πŸš€

Did this answer your question?