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