{"id":862,"date":"2021-11-04T13:26:34","date_gmt":"2021-11-04T13:26:34","guid":{"rendered":"https:\/\/www.figpii.com\/blog\/?p=862"},"modified":"2025-02-25T08:58:03","modified_gmt":"2025-02-25T08:58:03","slug":"how-to-make-heat-maps-on-your-website","status":"publish","type":"post","link":"https:\/\/www.figpii.com\/blog\/how-to-make-heat-maps-on-your-website\/","title":{"rendered":"How To Make Heat Maps On Your Website?"},"content":{"rendered":"\r\n<div class=\"wp-block-ht-block-toc  is-style-outline htoc htoc--position-wide toc-list-style-plain\" data-htoc-state=\"expanded\"><span class=\"htoc__title\"><span class=\"ht_toc_title\">Table of Contents<\/span><\/span>\r\n<div class=\"htoc__itemswrap\">\r\n<ul class=\"ht_toc_list\">\r\n<li class=\"\"><a href=\"#htoc-how-to-make-heat-maps-on-your-website-for-free\">How To Make Heat Maps On Your Website For Free?<\/a>\r\n<ul class=\"ht_toc_child_list\">\r\n<li class=\"\"><a href=\"#htoc-heatmap-js\">Heatmap.js<\/a><\/li>\r\n<li class=\"\"><a href=\"#htoc-google-analytics-heatmaps\">Google Analytics Heatmaps<\/a><\/li>\r\n<\/ul>\r\n<\/li>\r\n<li class=\"\"><a href=\"#htoc-how-to-make-heat-maps-on-your-website-with-paid-tools\">How To Make Heat Maps On Your Website With Paid Tools?<\/a><\/li>\r\n<li class=\"\"><a href=\"#htoc-conclusion\">Conclusion\u00a0<\/a><\/li>\r\n<\/ul>\r\n<\/div>\r\n<\/div>\r\n\r\n\r\n\r\n<p>&nbsp;<\/p><div id=\"ez-toc-container\" class=\"ez-toc-v2_0_74 ez-toc-wrap-left counter-hierarchy ez-toc-counter ez-toc-transparent ez-toc-container-direction\">\n<div class=\"ez-toc-title-container\">\n<p class=\"ez-toc-title\" style=\"cursor:inherit\">Table of Contents<\/p>\n<span class=\"ez-toc-title-toggle\"><a href=\"#\" class=\"ez-toc-pull-right ez-toc-btn ez-toc-btn-xs ez-toc-btn-default ez-toc-toggle\" aria-label=\"Toggle Table of Content\"><span class=\"ez-toc-js-icon-con\"><span class=\"\"><span class=\"eztoc-hide\" style=\"display:none;\">Toggle<\/span><span class=\"ez-toc-icon-toggle-span\"><svg style=\"fill: #999;color:#999\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" class=\"list-377408\" width=\"20px\" height=\"20px\" viewBox=\"0 0 24 24\" fill=\"none\"><path d=\"M6 6H4v2h2V6zm14 0H8v2h12V6zM4 11h2v2H4v-2zm16 0H8v2h12v-2zM4 16h2v2H4v-2zm16 0H8v2h12v-2z\" fill=\"currentColor\"><\/path><\/svg><svg style=\"fill: #999;color:#999\" class=\"arrow-unsorted-368013\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"10px\" height=\"10px\" viewBox=\"0 0 24 24\" version=\"1.2\" baseProfile=\"tiny\"><path d=\"M18.2 9.3l-6.2-6.3-6.2 6.3c-.2.2-.3.4-.3.7s.1.5.3.7c.2.2.4.3.7.3h11c.3 0 .5-.1.7-.3.2-.2.3-.5.3-.7s-.1-.5-.3-.7zM5.8 14.7l6.2 6.3 6.2-6.3c.2-.2.3-.5.3-.7s-.1-.5-.3-.7c-.2-.2-.4-.3-.7-.3h-11c-.3 0-.5.1-.7.3-.2.2-.3.5-.3.7s.1.5.3.7z\"\/><\/svg><\/span><\/span><\/span><\/a><\/span><\/div>\n<nav><ul class='ez-toc-list ez-toc-list-level-1 eztoc-toggle-hide-by-default' ><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-1\" href=\"https:\/\/www.figpii.com\/blog\/how-to-make-heat-maps-on-your-website\/#How_To_Make_Heat_Maps_On_Your_Website_For_Free\" >How To Make Heat Maps On Your Website For Free?<\/a><ul class='ez-toc-list-level-3' ><li class='ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-2\" href=\"https:\/\/www.figpii.com\/blog\/how-to-make-heat-maps-on-your-website\/#Heatmapjs\" >Heatmap.js<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-3\" href=\"https:\/\/www.figpii.com\/blog\/how-to-make-heat-maps-on-your-website\/#Google_Analytics_Heatmaps\" >Google Analytics Heatmaps<\/a><ul class='ez-toc-list-level-4' ><li class='ez-toc-heading-level-4'><a class=\"ez-toc-link ez-toc-heading-4\" href=\"https:\/\/www.figpii.com\/blog\/how-to-make-heat-maps-on-your-website\/#How_to_install_Google_Analytics_Heat_Map\" >How to install Google Analytics Heat Map<\/a><\/li><\/ul><\/li><\/ul><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-5\" href=\"https:\/\/www.figpii.com\/blog\/how-to-make-heat-maps-on-your-website\/#How_To_Make_Heat_Maps_On_Your_Website_With_Paid_Tools\" >How To Make Heat Maps On Your Website With Paid Tools?<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-6\" href=\"https:\/\/www.figpii.com\/blog\/how-to-make-heat-maps-on-your-website\/#Conclusion\" >Conclusion\u00a0<\/a><\/li><\/ul><\/nav><\/div>\n\r\n\r\n\r\n\r\n<p>I want you to imagine that you\u2019re freely living in your users\u2019 heads when they enter your website.<\/p>\r\n\r\n\r\n\r\n<p>You know everything about their visit and how did they interact with your website.<\/p>\r\n\r\n\r\n\r\n<p>In a nutshell that\u2019s what <a href=\"https:\/\/www.figpii.com\/\">FigPii<\/a> does for you, it opens a doorway into your users\u2019 minds.<\/p>\r\n\r\n\r\n\r\n<p>But we\u2019re here to give you all the ways that you can make a heatmap on your website, with or without <a href=\"https:\/\/www.figpii.com\/\">FIgPii<\/a>.<\/p>\r\n\r\n\r\n\r\n<p>We care to give you the best experience out there so if you decide to run with our product it\u2019s because you believe in it.<\/p>\r\n\r\n\r\n\r\n<p>With that out of the way, let start with some basic terms.<\/p>\r\n\r\n\r\n\r\n<p>What\u2019s a heatmap? Heatmaps are a visual representation of data.<br \/><br \/>The most common heatmap is the clicks map, which uses varying shades\/colors to represent changes in the number of clicks.<br \/><br \/>To many clicks = Red \/ No or less clicks = Blue.<\/p>\r\n\r\n\r\n\r\n<p>There are 3 major types of heatmaps.<\/p>\r\n\r\n\r\n\r\n<p>Move, click, scroll.<\/p>\r\n\r\n\r\n\r\n<p>Move maps: This kind of map shows in what places did your users hover and move using their mouse cursor.<\/p>\r\n\r\n\r\n\r\n<p>Click maps: This kind of map shows you how many people clicked on a certain element, like a button or a menu.<\/p>\r\n\r\n\r\n\r\n<p>Scroll maps: This kind of map shows you how much did your customer scroll down your page.<\/p>\r\n\r\n\r\n\r\n<h2 class=\"wp-block-heading\" id=\"htoc-how-to-make-heat-maps-on-your-website-for-free\"><span class=\"ez-toc-section\" id=\"How_To_Make_Heat_Maps_On_Your_Website_For_Free\"><\/span><br \/>How To Make Heat Maps On Your Website For Free?<span class=\"ez-toc-section-end\"><\/span><\/h2>\r\n\r\n\r\n\r\n<p>Now that you know more about heatmaps, let\u2019s move to how can you add heatmap analytics to your website.<br \/><br \/>You can do that using heatmap.js.<\/p>\r\n\r\n\r\n\r\n<h3 class=\"wp-block-heading\" id=\"htoc-heatmap-js\"><span class=\"ez-toc-section\" id=\"Heatmapjs\"><\/span>Heatmap.js<span class=\"ez-toc-section-end\"><\/span><\/h3>\r\n\r\n\r\n\r\n\r\n\r\n<p>It\u2019s free to use, but you need to know how to implement it on your website, or you need a developer to do the work for you.<br \/><br \/>Now Hetamap.js looks like a nice option for analyzing user behavior and doing some digging, but it doesn\u2019t have a nice dashboard for you, no filters, nothing you\u2019re familiar with.<\/p>\r\n\r\n\r\n\r\n<p>And there\u2019s this\u2026\u00a0<\/p>\r\n\r\n\r\n\r\n\r\n\r\n<h3 class=\"wp-block-heading\" id=\"htoc-google-analytics-heatmaps\"><span class=\"ez-toc-section\" id=\"Google_Analytics_Heatmaps\"><\/span>Google Analytics Heatmaps<span class=\"ez-toc-section-end\"><\/span><\/h3>\r\n\r\n\r\n\r\n<p><br \/>I would have suggested you take a look at Google Analytics\u2019 <a href=\"https:\/\/www.figpii.com\/blog\/top-9-heatmap-tools-of-2022\/\">Heatmap tool<\/a>, but they deprecated it.<br \/><br \/>It might still work for you, so I\u2019ll walk you through the process.\u00a0<\/p>\r\n\r\n\r\n\r\n<p>Go on Google Chrome Web Store; Enter \u201c<a href=\"https:\/\/www.figpii.com\/blog\/google-analytics-heat-map-alternative\/\">Google Analytics Heat Map<\/a>\u201d; Click Install<br \/><br \/><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/lh5.googleusercontent.com\/v9jD5CuVrIq_9_er1ZUVR-wR3V0ZgqFSg-GlQcGKUrAVwU7L9Eqq3VIwXmUVpU0QYzgU5l6ZCQtRxlTKI4Gx_gyjcpekjUHkIBP-pf7FuSVDYJ5PUqd6_qT3Bh8JJaj6OWrdRnd4\" width=\"624\" height=\"448\" \/><\/p>\r\n\r\n\r\n\r\n<p>That was easy! But now you\u2019ll need your account in order to use Google Analytics.<\/p>\r\n\r\n\r\n\r\n<p>If you don\u2019t have one yet, remember that you can create a free Google Analytics account here.<\/p>\r\n\r\n\r\n\r\n<p>Once you\u2019re in log in to your Google Analytics account.<\/p>\r\n\r\n\r\n\r\n<p>Go to your website\u2019s homepage, and you should see a Google Analytics overlay detailing the pageviews, bounce rate, and other analytics metrics.<\/p>\r\n\r\n\r\n\r\n<p>google-analytics-heatmap-in-action<\/p>\r\n\r\n\r\n\r\n<p>If this works for you then you\u2019re lucky, but if it doesn\u2019t, well, that\u2019s the expected.<\/p>\r\n\r\n\r\n\r\n<p>but don\u2019t worry, if you\u2019re looking for a <a href=\"https:\/\/www.figpii.com\/blog\/google-analytics-heat-map-alternative\/\">Google Analytics heat map<\/a>, then I\u2019m glad that you found this article.<\/p>\r\n\r\n\r\n\r\n<p>If Google\u2019s old tool is not working out for you it\u2019s because hasn\u2019t been updated since 2017,<\/p>\r\n\r\n\r\n\r\n<p><br \/>As I said in my intro which is sad news, Google has killed its <a href=\"https:\/\/www.figpii.com\/blog\/top-9-heatmap-tools-of-2022\/\">heat mapping tool<\/a> in 2017.<\/p>\r\n\r\n\r\n\r\n<p>If you try to install it you\u2019ll get the most basic info that you can possibly imagine.<\/p>\r\n\r\n\r\n\r\n<p>No colorful heatmaps, no detailed analytics, no easy-to-use interface, nothing.<\/p>\r\n\r\n\r\n\r\n<p>Just a basic Google Analytics dashboard with no heatmap feature whatsoever.<\/p>\r\n\r\n\r\n\r\n<p>The <a href=\"https:\/\/www.figpii.com\/blog\/google-analytics-heat-map-alternative\/\">Google analytics heat map tool<\/a> was very popular for years.<\/p>\r\n\r\n\r\n\r\n<p>It gave users the opportunity of seeing how many pageviews and clicks each section on their website had received in an easy-to-navigate interface.<\/p>\r\n\r\n\r\n\r\n<figure class=\"wp-block-image\"><img decoding=\"async\" src=\"https:\/\/lh5.googleusercontent.com\/NdpYZXap04wQ7HEGsBPnE6EXyfGKc8_Zw1v6gqBwMImGYY1c1Mbn11xD0KJGEAdvkjO-NmES2Am2277wAj8qiu0QHuAn9ey-yY6CQUnXe_Wr5ce2lusmvZeXEf5R8Gi2Cy3hWdLn\" alt=\"\" \/><\/figure>\r\n\r\n\r\n\r\n<p>While yes Google has deprecated this extension, it sometimes works, if you\u2019re lucky enough.<\/p>\r\n\r\n\r\n\r\n<p>If you would like to try your luck I\u2019ll run you through the install process.<\/p>\r\n\r\n\r\n\r\n<p>Be sure to let us know if it works for you or not.<\/p>\r\n\r\n\r\n\r\n<figure class=\"wp-block-image\"><img decoding=\"async\" src=\"https:\/\/lh3.googleusercontent.com\/3UdihQZN6icZaA-Piq-jC68Sk5YBIWfPz7lsPnsXsbAlFjGdZjcB9XmKoBSR9ZuuH4-rFfDEpSvAZ0E-FPZD8KTG8wUtw0Tw7UnIvF4si4jHdQfuirAPzZ4dbYbpwaiV4kvpqXKN\" alt=\"\" \/><\/figure>\r\n\r\n\r\n\r\n<h4 class=\"wp-block-heading\" id=\"htoc-how-to-install-google-analytics-heat-map\"><span class=\"ez-toc-section\" id=\"How_to_install_Google_Analytics_Heat_Map\"><\/span>How to install <a href=\"https:\/\/www.figpii.com\/blog\/google-analytics-heat-map-alternative\/\">Google Analytics Heat Map<br \/><\/a><span class=\"ez-toc-section-end\"><\/span><\/h4>\r\n\r\n\r\n\r\n<p>Go on Google Chrome Web Store; Enter \u201cGoogle Analytics Heat Map\u201d; Click Install<\/p>\r\n\r\n\r\n\r\n<p>That was easy! But now you\u2019ll need your account in order to use Google Analytics.<\/p>\r\n\r\n\r\n\r\n<p>If you don\u2019t have one yet, remember that you can create a free Google Analytics account here.<\/p>\r\n\r\n\r\n\r\n<p>Once you\u2019re in log in to your Google Analytics account.<\/p>\r\n\r\n\r\n\r\n<p>Go to your website\u2019s homepage, and you should see a Google Analytics overlay detailing the pageviews, bounce rate, and other analytics metrics.<\/p>\r\n\r\n\r\n\r\n<p>google-analytics-heatmap-in-action<\/p>\r\n\r\n\r\n\r\n<p>If this works for you then you\u2019re lucky, but if it doesn\u2019t, well, that\u2019s the expected.<\/p>\r\n\r\n\r\n\r\n<p>but don\u2019t worry, if you\u2019re looking for a Google Analytics heat map, then I\u2019m glad that you found this article.<\/p>\r\n\r\n\r\n\r\n<p>If Google\u2019s old tool is not working out for you it\u2019s because hasn\u2019t been updated since 2017.<\/p>\r\n\r\n\r\n\r\n<p><br \/>You can go for Hotjar if you want a free plan, but it\u2019s hugely limited and I don\u2019t think it\u2019ll satisfy your needs.<\/p>\r\n\r\n\r\n\r\n<h2 class=\"wp-block-heading\" id=\"htoc-how-to-make-heat-maps-on-your-website-with-paid-tools\"><span class=\"ez-toc-section\" id=\"How_To_Make_Heat_Maps_On_Your_Website_With_Paid_Tools\"><\/span><br \/>How To Make Heat Maps On Your Website With Paid Tools?<span class=\"ez-toc-section-end\"><\/span><\/h2>\r\n\r\n\r\n\r\n<p>There are quite some tools that allow you to make heatmaps on your website, like FigPii, HotJar, etc.<br \/><br \/>We\u2019ve made a round-up of these tools for your convenience so you can check them out <a href=\"https:\/\/www.figpii.com\/blog\/top-10-user-insights-software-in-2021\/\">here<\/a><\/p>\r\n\r\n\r\n\r\n<p><br \/>We\u2019ve made a guide on how can you implement FigPii on your website to get the most comprehensive analytics of all time.<br \/><br \/>You can check the full <a href=\"https:\/\/www.figpii.com\/blog\/the-complete-guide-to-heatmaps\/\">guide from here<\/a>, but I\u2019ll give you a quick rundown to get you started.<\/p>\r\n\r\n\r\n\r\n<p>1. Signup for FIgPii using <a href=\"https:\/\/figpii.com?fp_ref=10off\">this link to get 10% off<\/a>. Then login into the dashboard.<br \/><br \/><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/lh6.googleusercontent.com\/5Cg7ErgJE4lLbgdcRM-PGXC_LRRTjlDBrQ539NAVsrR7u3iRXlJ65KbfEb7uWENBzDIA7rNwkNVBjDw4v72ruUWXLQfhkjxkJKkxv2BZ3t2uSSU41F9J7DgF4dDNYy3ROoUbXPRt\" width=\"624\" height=\"316\" \/><\/p>\r\n\r\n\r\n\r\n<p>2. The FigPii code will appear at the bottom section of the dashboard3. Click on \u201ccopy code\u201d4. Paste the FigPii Tracking Code into the &lt;head&gt; section of your website.<\/p>\r\n\r\n\r\n\r\n<figure class=\"wp-block-image\"><img decoding=\"async\" src=\"https:\/\/lh6.googleusercontent.com\/F1GeisdLUxYGn2nh0OPmkFaxT9_r9FpUqH4RxVkc0f79gWVezHSbMTK4cxkKfNmdd7TTho64OZxqjDLEc5NUke-T9O3xVTyBlejtp_Bmp5x2-K6Gol5rgW9P4yt2UonFc_tGCTWI\" alt=\"\" \/><\/figure>\r\n\r\n\r\n\r\n<p>3. Click on \u201ccopy code\u201d<\/p>\r\n\r\n\r\n\r\n<p>4. Paste the FigPii Tracking Code into the &lt;head&gt; section of your website.<\/p>\r\n\r\n\r\n\r\n<p>FigPii integrates with major CMS and e-commerce websites, check our full list of integrations right here.\u00a0<\/p>\r\n\r\n\r\n\r\n<p>5. Check your FigPii dashboard to verify the installation. When the tracking code is installed on your site, the tracking indicator will show you that the code is active.<\/p>\r\n\r\n\r\n\r\n<p>Once you have added the FigPii Tracking Code to your site, you will need to wait for about an hour to check if it is installed correctly. This usually happens the moment your site is loaded with the FigPii tracking code installed in. But there can be a delay for up to an hour before it shows as \u201cActive\u201d.\u00a0\u00a0<\/p>\r\n\r\n\r\n\r\n<p>6. log in to FIgPii\u2019s dashboard, and go over the heatmap section from the side menu.<\/p>\r\n\r\n\r\n\r\n<p>7. Press on create a heat map<\/p>\r\n\r\n\r\n\r\n<p>8. Name your heat map<\/p>\r\n\r\n\r\n\r\n<p>9. Choose the number of recordings that you want<\/p>\r\n\r\n\r\n\r\n<p>10. Choose which platform you would like to record, you can choose mobile or desktop.<\/p>\r\n\r\n\r\n\r\n<p>You\u2019re also able to track new visitors or returning users.<\/p>\r\n\r\n\r\n\r\n<p>11. Choose which page or pages you would like to track with your heatmap.<\/p>\r\n\r\n\r\n\r\n<p>12. Configure your map with advanced options that help you create more accurate data<\/p>\r\n\r\n\r\n\r\n<p>You\u2019re done! Now you\u2019ll be able to track your users like you never could before!<\/p>\r\n\r\n\r\n\r\n<h2 class=\"wp-block-heading\" id=\"htoc-conclusion\"><span class=\"ez-toc-section\" id=\"Conclusion\"><\/span>Conclusion\u00a0<span class=\"ez-toc-section-end\"><\/span><\/h2>\r\n\r\n\r\n\r\n<p>Adding a heatmap to your website can be done for free, you just need to have the right skills for it.<br \/><br \/>Or have some luck if you\u2019re trying Google Analytics\u2019 deprecated plugin.<br \/><br \/>There are some tools that have a free plan yes like hotjar, but their free plan is super limited.<br \/><br \/>It just doesn\u2019t let you capture as much analytics as you want.<br \/><br \/>Then we move to the paid tools like FigPIi.<br \/><br \/>If you want to know <a href=\"https:\/\/www.figpii.com\/blog\/why-figpii-is-the-only-heat-map-tool-youll-need\/\">why FigPii is the only heat map tool you\u2019ll need!<\/a> You can check this blog.<br \/><br \/>We\u2019d love it if you gave FigPii a run, so if you signup through this link you\u2019ll get a <a href=\"https:\/\/figpii.com?fp_ref=10off\">10% off FOREVER<\/a>.\u00a0<\/p>\r\n","protected":false},"excerpt":{"rendered":"<p>&nbsp; I want you to imagine that you\u2019re freely living in your users\u2019 heads when they enter your website. You know everything about their visit and how did they interact with your website. In a nutshell that\u2019s what FigPii does for you, it opens a doorway into your users\u2019 minds. But we\u2019re here to give<\/p>\n","protected":false},"author":5,"featured_media":780,"comment_status":"closed","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_eb_attr":"","footnotes":""},"categories":[205],"tags":[],"class_list":{"0":"post-862","1":"post","2":"type-post","3":"status-publish","4":"format-standard","5":"has-post-thumbnail","7":"category-heat-maps"},"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v25.3.1 - https:\/\/yoast.com\/wordpress\/plugins\/seo\/ -->\n<title>How To Make Heat Maps On Your Website? - FigPii blog<\/title>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/www.figpii.com\/blog\/how-to-make-heat-maps-on-your-website\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"How To Make Heat Maps On Your Website? - FigPii blog\" \/>\n<meta property=\"og:description\" content=\"&nbsp; I want you to imagine that you\u2019re freely living in your users\u2019 heads when they enter your website. You know everything about their visit and how did they interact with your website. In a nutshell that\u2019s what FigPii does for you, it opens a doorway into your users\u2019 minds. But we\u2019re here to give\" \/>\n<meta property=\"og:url\" content=\"https:\/\/www.figpii.com\/blog\/how-to-make-heat-maps-on-your-website\/\" \/>\n<meta property=\"og:site_name\" content=\"FigPii blog\" \/>\n<meta property=\"article:publisher\" content=\"https:\/\/www.facebook.com\/figpii.aii\/\" \/>\n<meta property=\"article:published_time\" content=\"2021-11-04T13:26:34+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2025-02-25T08:58:03+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/www.figpii.com\/blog\/wp-content\/uploads\/2021\/10\/The-new-design-1.png\" \/>\n\t<meta property=\"og:image:width\" content=\"1059\" \/>\n\t<meta property=\"og:image:height\" content=\"486\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/png\" \/>\n<meta name=\"author\" content=\"Mostafa Daoud\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:creator\" content=\"@figpii\" \/>\n<meta name=\"twitter:site\" content=\"@figpii\" \/>\n<meta name=\"twitter:label1\" content=\"Written by\" \/>\n\t<meta name=\"twitter:data1\" content=\"Mostafa Daoud\" \/>\n\t<meta name=\"twitter:label2\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data2\" content=\"7 minutes\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\/\/www.figpii.com\/blog\/how-to-make-heat-maps-on-your-website\/#article\",\"isPartOf\":{\"@id\":\"https:\/\/www.figpii.com\/blog\/how-to-make-heat-maps-on-your-website\/\"},\"author\":{\"name\":\"Mostafa Daoud\",\"@id\":\"https:\/\/www.figpii.com\/blog\/#\/schema\/person\/7ffb80a9b7f62cccfb0a71c224362415\"},\"headline\":\"How To Make Heat Maps On Your Website?\",\"datePublished\":\"2021-11-04T13:26:34+00:00\",\"dateModified\":\"2025-02-25T08:58:03+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\/\/www.figpii.com\/blog\/how-to-make-heat-maps-on-your-website\/\"},\"wordCount\":1328,\"publisher\":{\"@id\":\"https:\/\/www.figpii.com\/blog\/#organization\"},\"image\":{\"@id\":\"https:\/\/www.figpii.com\/blog\/how-to-make-heat-maps-on-your-website\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/www.figpii.com\/blog\/wp-content\/uploads\/2021\/10\/The-new-design-1.png\",\"articleSection\":[\"Heat Maps\"],\"inLanguage\":\"en-US\"},{\"@type\":\"WebPage\",\"@id\":\"https:\/\/www.figpii.com\/blog\/how-to-make-heat-maps-on-your-website\/\",\"url\":\"https:\/\/www.figpii.com\/blog\/how-to-make-heat-maps-on-your-website\/\",\"name\":\"How To Make Heat Maps On Your Website? - FigPii blog\",\"isPartOf\":{\"@id\":\"https:\/\/www.figpii.com\/blog\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\/\/www.figpii.com\/blog\/how-to-make-heat-maps-on-your-website\/#primaryimage\"},\"image\":{\"@id\":\"https:\/\/www.figpii.com\/blog\/how-to-make-heat-maps-on-your-website\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/www.figpii.com\/blog\/wp-content\/uploads\/2021\/10\/The-new-design-1.png\",\"datePublished\":\"2021-11-04T13:26:34+00:00\",\"dateModified\":\"2025-02-25T08:58:03+00:00\",\"breadcrumb\":{\"@id\":\"https:\/\/www.figpii.com\/blog\/how-to-make-heat-maps-on-your-website\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/www.figpii.com\/blog\/how-to-make-heat-maps-on-your-website\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/www.figpii.com\/blog\/how-to-make-heat-maps-on-your-website\/#primaryimage\",\"url\":\"https:\/\/www.figpii.com\/blog\/wp-content\/uploads\/2021\/10\/The-new-design-1.png\",\"contentUrl\":\"https:\/\/www.figpii.com\/blog\/wp-content\/uploads\/2021\/10\/The-new-design-1.png\",\"width\":1059,\"height\":486},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/www.figpii.com\/blog\/how-to-make-heat-maps-on-your-website\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\/\/www.figpii.com\/blog\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"How To Make Heat Maps On Your Website?\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/www.figpii.com\/blog\/#website\",\"url\":\"https:\/\/www.figpii.com\/blog\/\",\"name\":\"FigPii blog\",\"description\":\"Let it marinate\",\"publisher\":{\"@id\":\"https:\/\/www.figpii.com\/blog\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/www.figpii.com\/blog\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"en-US\"},{\"@type\":\"Organization\",\"@id\":\"https:\/\/www.figpii.com\/blog\/#organization\",\"name\":\"FigPii\",\"url\":\"https:\/\/www.figpii.com\/blog\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/www.figpii.com\/blog\/#\/schema\/logo\/image\/\",\"url\":\"https:\/\/www.figpii.com\/blog\/wp-content\/uploads\/2023\/09\/figpii-logo-purple.png\",\"contentUrl\":\"https:\/\/www.figpii.com\/blog\/wp-content\/uploads\/2023\/09\/figpii-logo-purple.png\",\"width\":104,\"height\":40,\"caption\":\"FigPii\"},\"image\":{\"@id\":\"https:\/\/www.figpii.com\/blog\/#\/schema\/logo\/image\/\"},\"sameAs\":[\"https:\/\/www.facebook.com\/figpii.aii\/\",\"https:\/\/x.com\/figpii\"]},{\"@type\":\"Person\",\"@id\":\"https:\/\/www.figpii.com\/blog\/#\/schema\/person\/7ffb80a9b7f62cccfb0a71c224362415\",\"name\":\"Mostafa Daoud\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/www.figpii.com\/blog\/#\/schema\/person\/image\/\",\"url\":\"https:\/\/secure.gravatar.com\/avatar\/9dc9d45229602dd2ee3be1f26fd1da9343925342dc237bbd4f62224b0af13961?s=96&d=mm&r=g\",\"contentUrl\":\"https:\/\/secure.gravatar.com\/avatar\/9dc9d45229602dd2ee3be1f26fd1da9343925342dc237bbd4f62224b0af13961?s=96&d=mm&r=g\",\"caption\":\"Mostafa Daoud\"},\"url\":\"https:\/\/www.figpii.com\/blog\/author\/mostafa\/\"}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"How To Make Heat Maps On Your Website? - FigPii blog","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/www.figpii.com\/blog\/how-to-make-heat-maps-on-your-website\/","og_locale":"en_US","og_type":"article","og_title":"How To Make Heat Maps On Your Website? - FigPii blog","og_description":"&nbsp; I want you to imagine that you\u2019re freely living in your users\u2019 heads when they enter your website. You know everything about their visit and how did they interact with your website. In a nutshell that\u2019s what FigPii does for you, it opens a doorway into your users\u2019 minds. But we\u2019re here to give","og_url":"https:\/\/www.figpii.com\/blog\/how-to-make-heat-maps-on-your-website\/","og_site_name":"FigPii blog","article_publisher":"https:\/\/www.facebook.com\/figpii.aii\/","article_published_time":"2021-11-04T13:26:34+00:00","article_modified_time":"2025-02-25T08:58:03+00:00","og_image":[{"width":1059,"height":486,"url":"https:\/\/www.figpii.com\/blog\/wp-content\/uploads\/2021\/10\/The-new-design-1.png","type":"image\/png"}],"author":"Mostafa Daoud","twitter_card":"summary_large_image","twitter_creator":"@figpii","twitter_site":"@figpii","twitter_misc":{"Written by":"Mostafa Daoud","Est. reading time":"7 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/www.figpii.com\/blog\/how-to-make-heat-maps-on-your-website\/#article","isPartOf":{"@id":"https:\/\/www.figpii.com\/blog\/how-to-make-heat-maps-on-your-website\/"},"author":{"name":"Mostafa Daoud","@id":"https:\/\/www.figpii.com\/blog\/#\/schema\/person\/7ffb80a9b7f62cccfb0a71c224362415"},"headline":"How To Make Heat Maps On Your Website?","datePublished":"2021-11-04T13:26:34+00:00","dateModified":"2025-02-25T08:58:03+00:00","mainEntityOfPage":{"@id":"https:\/\/www.figpii.com\/blog\/how-to-make-heat-maps-on-your-website\/"},"wordCount":1328,"publisher":{"@id":"https:\/\/www.figpii.com\/blog\/#organization"},"image":{"@id":"https:\/\/www.figpii.com\/blog\/how-to-make-heat-maps-on-your-website\/#primaryimage"},"thumbnailUrl":"https:\/\/www.figpii.com\/blog\/wp-content\/uploads\/2021\/10\/The-new-design-1.png","articleSection":["Heat Maps"],"inLanguage":"en-US"},{"@type":"WebPage","@id":"https:\/\/www.figpii.com\/blog\/how-to-make-heat-maps-on-your-website\/","url":"https:\/\/www.figpii.com\/blog\/how-to-make-heat-maps-on-your-website\/","name":"How To Make Heat Maps On Your Website? - FigPii blog","isPartOf":{"@id":"https:\/\/www.figpii.com\/blog\/#website"},"primaryImageOfPage":{"@id":"https:\/\/www.figpii.com\/blog\/how-to-make-heat-maps-on-your-website\/#primaryimage"},"image":{"@id":"https:\/\/www.figpii.com\/blog\/how-to-make-heat-maps-on-your-website\/#primaryimage"},"thumbnailUrl":"https:\/\/www.figpii.com\/blog\/wp-content\/uploads\/2021\/10\/The-new-design-1.png","datePublished":"2021-11-04T13:26:34+00:00","dateModified":"2025-02-25T08:58:03+00:00","breadcrumb":{"@id":"https:\/\/www.figpii.com\/blog\/how-to-make-heat-maps-on-your-website\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/www.figpii.com\/blog\/how-to-make-heat-maps-on-your-website\/"]}]},{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/www.figpii.com\/blog\/how-to-make-heat-maps-on-your-website\/#primaryimage","url":"https:\/\/www.figpii.com\/blog\/wp-content\/uploads\/2021\/10\/The-new-design-1.png","contentUrl":"https:\/\/www.figpii.com\/blog\/wp-content\/uploads\/2021\/10\/The-new-design-1.png","width":1059,"height":486},{"@type":"BreadcrumbList","@id":"https:\/\/www.figpii.com\/blog\/how-to-make-heat-maps-on-your-website\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/www.figpii.com\/blog\/"},{"@type":"ListItem","position":2,"name":"How To Make Heat Maps On Your Website?"}]},{"@type":"WebSite","@id":"https:\/\/www.figpii.com\/blog\/#website","url":"https:\/\/www.figpii.com\/blog\/","name":"FigPii blog","description":"Let it marinate","publisher":{"@id":"https:\/\/www.figpii.com\/blog\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/www.figpii.com\/blog\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"en-US"},{"@type":"Organization","@id":"https:\/\/www.figpii.com\/blog\/#organization","name":"FigPii","url":"https:\/\/www.figpii.com\/blog\/","logo":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/www.figpii.com\/blog\/#\/schema\/logo\/image\/","url":"https:\/\/www.figpii.com\/blog\/wp-content\/uploads\/2023\/09\/figpii-logo-purple.png","contentUrl":"https:\/\/www.figpii.com\/blog\/wp-content\/uploads\/2023\/09\/figpii-logo-purple.png","width":104,"height":40,"caption":"FigPii"},"image":{"@id":"https:\/\/www.figpii.com\/blog\/#\/schema\/logo\/image\/"},"sameAs":["https:\/\/www.facebook.com\/figpii.aii\/","https:\/\/x.com\/figpii"]},{"@type":"Person","@id":"https:\/\/www.figpii.com\/blog\/#\/schema\/person\/7ffb80a9b7f62cccfb0a71c224362415","name":"Mostafa Daoud","image":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/www.figpii.com\/blog\/#\/schema\/person\/image\/","url":"https:\/\/secure.gravatar.com\/avatar\/9dc9d45229602dd2ee3be1f26fd1da9343925342dc237bbd4f62224b0af13961?s=96&d=mm&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/9dc9d45229602dd2ee3be1f26fd1da9343925342dc237bbd4f62224b0af13961?s=96&d=mm&r=g","caption":"Mostafa Daoud"},"url":"https:\/\/www.figpii.com\/blog\/author\/mostafa\/"}]}},"_links":{"self":[{"href":"https:\/\/www.figpii.com\/blog\/wp-json\/wp\/v2\/posts\/862","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.figpii.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.figpii.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.figpii.com\/blog\/wp-json\/wp\/v2\/users\/5"}],"replies":[{"embeddable":true,"href":"https:\/\/www.figpii.com\/blog\/wp-json\/wp\/v2\/comments?post=862"}],"version-history":[{"count":8,"href":"https:\/\/www.figpii.com\/blog\/wp-json\/wp\/v2\/posts\/862\/revisions"}],"predecessor-version":[{"id":5835,"href":"https:\/\/www.figpii.com\/blog\/wp-json\/wp\/v2\/posts\/862\/revisions\/5835"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.figpii.com\/blog\/wp-json\/wp\/v2\/media\/780"}],"wp:attachment":[{"href":"https:\/\/www.figpii.com\/blog\/wp-json\/wp\/v2\/media?parent=862"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.figpii.com\/blog\/wp-json\/wp\/v2\/categories?post=862"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.figpii.com\/blog\/wp-json\/wp\/v2\/tags?post=862"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}