The most advanced free analytics plugin for user tracking and heat maps overlayed on your website.
I cannot see the heat map when adding URL query parameter drawHeatMap=true.
You cannot view the heat maps if your theme is not HTML5 compliant and you need to use an Internet browser which supports HTML5 canvas. Most modern browsers support HTML5 canvas now. Make sure the Enable drawing heat map option is turned on in the General options tab. If you see a box with the current browser window width, zoom level and device pixel information at the bottom right corner of your webpage, then there is no matching heat map data. You may need to resize the window, modify the zoom levels and device pixel ratios to match the heat map data collected. You can use the Heat Maps tab to find matching heat map data and to view the heat maps.
Plugin update does not seem to be working
Heat map is now showing
The plugin relies on HTML5 canvas element to draw the heat map. Check your theme supports HTML5. Saving the mouse clicks and touch screen taps works in non HTML5 browsers.
How do I target different device pixel ratios, widths, zoom levels, devices, browsers and operating systems when viewing the heat map?
In the heat maps tab you can filter by URL, width, device pixel ratio, zoom level, devices, browsers and operating systems. Here you might see some different values which can be used to target different heat maps. Additional parameters can be passed along with the ?drawHeatMap=true query parameter to help target the heat maps: * width - Width i.e. 1600 * devicePixelRatio - Device pixel ratio i.e. 1 * zoomLevel - Zoom level i.e. 1 * osFamily - Operating system i.e. Windows 7, Windows 8, Android, Mac OS X etc... * browserFamily - Operating System i.e. IE, Firefox, Safari etc... * device - Device i.e. Other, iPad etc...
Here's an example: http://www.mywebsite.com?drawHeatMap=true&width=1600&devicePixelRatio=1&zoomLevel=1&osFamily=Mac OS X&browserFamily=Chrome&device=Other
Does the plugin impact performance
Yes, but it is basically negligable for most websites. An extra request is made to the server every mouse click and touch screen tap. You can use the schedule start date and end date feature to save mouse clicks and touch screen taps in a small window such as off peak usage times. There are also database limits that can be set so that the database is not over populated.
I only want to use the plugin on one page
There are URL filters you can use to include or exclude the plugin for different URLs.
Can I reset the database?
There is an option to clear the database.
Mouse clicks or touch screen taps not being saved when I click on a button or link
Width is not the same when I view heat map from backend
Sometimes the browser adds a veritcal scrollbar which is subtracted from the width. E.g. 17px for Firefox. So if you wanted to view 1600px and when viewing the heat map the expanded browser window is 1583px with a vertical scrollbar of 17px, change the width allowance optionin the heat map settings tab to allow the mouse clicks to be displayed for 17px difference.
How do I change the heat map display?
What is device pixel ratio?
The device pixel ratio is the ratio between logical pixels and physical pixels (for websites that is the display device pixel density compared with CSS pixels). For instance, the iPhone 4 and iPhone 4S reports a device pixel ratio of 2, because the physical linear resolution is double the logical resolution (physical resolution: 960 x 640 and logical resolution: 480 x 320). A higher device pixel ratio means a higher quality display (effectively more dots per inch on the display screen). Note your website will likely appear differently if a device has different pixel ratio (device pixels compared to web page CSS pixels). Images may be better or less quality, text may be larger or smaller, images may be different size widths and heights etc...
How do I view the heat maps for different devices
If you have heat map data with various device pixel ratios, then you can use the actual device or find a device emulator to view the the heat maps. There are also options to ignore the device pixel ratio, ignore the zoom level and to ignore the width, but these options will not provide accurate heat map results.
How do I view the heat maps for different device pixel ratios?
The device pixel ratio is dependant on your display device pixels per inch. The best way to view the heat maps for different devices is to use the actual devices itself. You can also try using device emulators (Android > http://developer.android.com/tools/help/emulator.html) or using an online service like https://www.manymo.com/.
Sometimes you can view the heat map for a different device pixel ratio by modifying the zoom level. For example a device pixel ration of 2:1 and zoom level of 200% for width 800px can be achieved on a 1600px monitor with a device pixel ratio of 1:1 by increasing the zoom level to 200%;
Do I have to resize the window to the exact width?
No. There is an option to allow up to 20 pixels each side of your target width to display the heat map. This amount can be changed and is defaulted to 6 pixels.
My screen resolution is not large enough to display some of the heat maps
You can try ignoring the device pixel ratio and ignore the zoom level options, then do a browser zoom out to increase the website width. However, the heat map may not be entirely accurate if you do this. For heat map data with a device pixel ratio of 1:1 and a zoom level of 100%, viewing larger website widths using this method works OK.
How do I define element selectors?
The element selectors are implemented as jQuery element selectors. You can find a summary of jQuery element selectors here: http://api.jquery.com/category/selectors/
Requires: 3.0.1 or higher
Compatible up to: 3.6.1
Last Updated: 2013-11-7
1 of 3 support threads in the last two months have been resolved.
Got something to say? Need help?