©2016 www.malougumana.com
How To Use HOTJAR
1
Your Complete Analytical Tools Heatmaps & Recordings
©2016 www.malougumana.com
Warning: Before you go
on this tutorial..
2
©2016 www.malougumana.com
Refer to this: http://malougumana.com/
tutorials/how-to-install-hotjar/
3
©2016 www.malougumana.com
To create Hotjar
account..4
©2016 www.malougumana.com
And install Hotjar in
Wordpress.5
©2016 www.malougumana.com
I assume you're done with those
pre-requisites.6
©2016 www.malougumana.com
Let's move on…
7
©2016 www.malougumana.com
Open your browser
8
©2016 www.malougumana.com
Type Hotjar URL on the address bar
9
©2016 www.malougumana.com
Press Enter on your keyboard
10
©2016 www.malougumana.com
This webpage opens
11
©2016 www.malougumana.com
Click SIGN IN
12
©2016 www.malougumana.com
Fill this out
13
©2016 www.malougumana.com
Type your registered email address
14
©2016 www.malougumana.com
Type your password
15
©2016 www.malougumana.com
Click Sign In
16
©2016 www.malougumana.com
This is Site Dashboard
17
©2016 www.malougumana.com
Let's see how Hotjar
works...18
©2016 www.malougumana.com
Go to your Wordpress Dashboard
19
©2016 www.malougumana.com
In wordpress, click Pages
20
©2016 www.malougumana.com
Click Add New
21
©2016 www.malougumana.com
Click here
22
©2016 www.malougumana.com
Type a Page Name
23
©2016 www.malougumana.com
Put page contents here
24
©2016 www.malougumana.com
Type the contents
25
©2016 www.malougumana.com
Click Publish
26
©2016 www.malougumana.com
Copy this permalink (the page URL)
27
©2016 www.malougumana.com
Highlight it
28
©2016 www.malougumana.com
Right click on your mouse
29
©2016 www.malougumana.com
And click Copy Link Address
30
©2016 www.malougumana.com
Click View Page to see it LIVE
31
©2016 www.malougumana.com
This is it!
32
©2016 www.malougumana.com
This is also the same permalink we just copied
33
©2016 www.malougumana.com
Open a note pad
34
©2016 www.malougumana.com
And paste the link there
35
©2016 www.malougumana.com
To save it for
later use.36
©2016 www.malougumana.com
How To Use Hotjar
HEATMAP37
©2016 www.malougumana.com
In Hotjar Dashboard, click Heatmaps
38
©2016 www.malougumana.com
Click New Heatmap
39
©2016 www.malougumana.com
Scroll down
40
©2016 www.malougumana.com
Click here
41
©2016 www.malougumana.com
Type NAME for heatmap
42
©2016 www.malougumana.com
Click here
43
©2016 www.malougumana.com
Select here how you will connect your webpage
44
©2016 www.malougumana.com
Click Exact match
45
©2016 www.malougumana.com
We need the webpage link here
46
©2016 www.malougumana.com
Go to your note pad
47
©2016 www.malougumana.com
Copy-paste the link here
48
©2016 www.malougumana.com
Click Advanced options
49
©2016 www.malougumana.com
Put nothing here
50
©2016 www.malougumana.com
We don't want to exclude elements
51
©2016 www.malougumana.com
Click here
52
©2016 www.malougumana.com
Paste here the webpage link from the notepad
(see slide 47)
53
©2016 www.malougumana.com
Tick this
54
©2016 www.malougumana.com
Click Create Heatmap
55
©2016 www.malougumana.com
There's the heatmap we just created
56
Let's now visit the webpage
©2016 www.malougumana.com
In your browser, Add New Tab
58
©2016 www.malougumana.com
Copy-Paste the webpage URL here from your notepad
59
©2016 www.malougumana.com
Just scroll, move your mouse around the page
60
©2016 www.malougumana.com
Click anywhere on the page
61
©2016 www.malougumana.com
We're doing those so that the heatmap
62
©2016 www.malougumana.com
Will record our
"actions"63
©2016 www.malougumana.com
Go Back to Hotjar window
64
©2016 www.malougumana.com
On your keyboard or
keypad..65
©2016 www.malougumana.com
Press F5 or CMD+R to refresh the
page66
©2016 www.malougumana.com
There's the recorded pageview we've just done
67
©2016 www.malougumana.com
Click View Heatmap
68
©2016 www.malougumana.com
Click this to see "Clicks"
69
©2016 www.malougumana.com
These are recorded clicks
70
©2016 www.malougumana.com
Use this to gauge what’s “HOT”
71
©2016 www.malougumana.com
Or “COLD”
72
©2016 www.malougumana.com
See here how many clicks were recorded
73
©2016 www.malougumana.com
Click this to see "Moves"
74
©2016 www.malougumana.com
Moves shows where the mouse
pointer moves around the page
75
©2016 www.malougumana.com
Click this to see "Scrolls"
76
©2016 www.malougumana.com
Scrolls will tell you if the visitor
77
©2016 www.malougumana.com
Checks until the bottom part of your
website78
©2016 www.malougumana.com
This will give you idea
79
©2016 www.malougumana.com
where to put important
buttons like the "BUY" button
80
©2016 www.malougumana.com
You can also download the heatmap here
81
©2016 www.malougumana.com
Heatmaps are important to see where your
visitors click
82
©2016 www.malougumana.com
This will tell you what to enhance on
the site83
©2016 www.malougumana.com
And what to remove/improve because nobody
pays attention84
©2016 www.malougumana.com
How To Use RECORDINGS
85
©2016 www.malougumana.com
In Hotjar Dashboard, click Recordings
86
©2016 www.malougumana.com
Click Record Visitors
87
©2016 www.malougumana.com
Click this to see recording options
88
©2016 www.malougumana.com
Select here what you want to be recorded
89
©2016 www.malougumana.com
Click Start Recording
90
©2016 www.malougumana.com
You can stop recording here
91
©2016 www.malougumana.com
Once someone visits the site, the recording will
be here
92
©2016 www.malougumana.com
You can see how many pages visited
93
©2016 www.malougumana.com
You can apply some filters here
94
©2016 www.malougumana.com
Click Play to watch recording
95
©2016 www.malougumana.com
This is a screenshot of a recording playing
96
©2016 www.malougumana.com
The strokes can be visible also
97
©2016 www.malougumana.com
The page visited is shown here
98
©2016 www.malougumana.com
You can skip pauses (for example visitor is reading)
99
©2016 www.malougumana.com
Recordings can be useful
to see in actual 100
©2016 www.malougumana.com
How visitor navigates your site
101
©2016 www.malougumana.com
This gives you idea
102
©2016 www.malougumana.com
What's on the web that attracts him
103
©2016 www.malougumana.com
You've just seen the power of
HOTJAR Heatmaps
104
©2016 www.malougumana.com
and Recordings to understand your visitors
105
©2016 www.malougumana.com
Use it to your advantage.
106
©2016 www.malougumana.com 107
The aim of marketing is to know and understand the
customer so well the product or service
fits him and sells itself.Peter Drucker