This is an easy step-by-step how to install Hotjar tutorial, where I will guide you through the process from registering a Hotjar account to implementing the code on your Website and creating your first heatmap.

Contains:

  • Registering an account.
  • Installing Hotjar on your site.
  • Let’s create a heatmap.

Registering an account

  1. Go to https://www.hotjar.com/ and click “TRY IT FOR FREE” button:

 

  1. Fill the registration form.

 

  1. Set your password, it must contain:
  • One special character
  • One uppercase character
  • One number
  • 8 to 50 characters long
  • One lowercase character

 

  1. Customize your account:
  • Choose your role (eg. Store Owner).
  • Manage Clients, select no if you are the owner of the site.
  • Organisation Name, your Website name or Organisation Name.

          Click Next >

  1. Enter your Website url (eg. https://yoursite.com replace yoursite.com with your actual site) and complete    reCaptcha.

Click “Start Using Hotjar”

 

 

Installing Hotjar on your site

 

1. Go to https://insights.hotjar.com and Copy this code:

 

2. Now go to your WordPress Dashboard.

3. Navigate to Plugins > Add New.

4. Search for Headers and Footers.

5. Find Plugin called “Insert Headers and Footers” and Click Install now.

6. When installation finishes, click Activate.

7. Navigate to Settings > Insert Headers and Footers.

8. Now paste the code we copied from Hotjar in text box Scripts in Header.

9. Click Save.

10. Go back to Hotjar and click “I have installed the tracking code” button.

11. Make sure you have entered your website’s url and click “Verify Installation” button.

12. Now you should see something like this:
“Hotjar installation verified”


13. Congratulations! You have successfully installed Hotjar! 

 

 

 

Let’s create a heatmap

 

  1. On the left sidebar click on Heatmaps and then click on “+ New Heatmap” button.

 

  1. Enter the name for your heatmap and click next.

 

  1. Select number of pages, I recommend 2.000 and click next.

  1. If you want to use heatmap for all your pages, select Visit on multiple similar pages and select URL starts with – https://yoursite.com/ (replace yoursite.com with your actual site)

 

  1. Click next.

 

  1. Click Create Heatmap button.

 

  1. Congratulations! You have successfully created your heatmap!

 

Hi. My name is Dositej and I am a
Full Stack Web Developer,
Wordpress Developer,
Specialised in PHP back-end and web apps.
I’m also learning game development in my spare time.
I’m from Bosnia, a small but nice country.

Shares
Share This