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! 🚀