如何在 WordPress 网站上安装热力图（一行代码，3分钟搞定）
- how-to
- wordpress
- heatmap
- installation
文章摘要
- 在 WordPress 中添加热力图，只需要粘贴一行代码
- 有三种实现方式：（1）主题的页头设置栏、（2）代码插入插件、（3）直接编辑 header.php
- 安装成功的标志是 HeatMapX 仪表盘中该站点的计数实际增加了——而不仅仅是“没有报错”
担心添加热力图意味着要跟代码死磕吗？在 WordPress 上，其实只需要一行标签代码。本指南将介绍三种添加方式，从最适合新手的简单方案到进阶方案依次讲解。
第一步：获取你的站点密钥
首先，注册 HeatMapX（提供免费方案），注册你的站点，获取站点密钥。无需信用卡。
拿到站点密钥后，使用下面的标签代码，将 YOUR_SITE_KEY 替换为你实际获得的密钥。
<script src="https://heatmapx.com/tracker.js" data-site-key="YOUR_SITE_KEY"></script>
用下面三种方法之一，将这段标签代码粘贴到你网站的 <head> 中。
方法一（推荐新手使用）：主题的页头设置
许多热门主题，例如 Astra 或 GeneratePress，都内置了一个设置栏——通常在“高级”或“自定义脚本”下——可以让你直接在 <head> 部分插入代码。
- 在 WordPress 后台，打开当前启用主题的自定义面板或设置面板
- 找到类似“页头脚本”“自定义代码”或“高级”这样命名的字段
- 将上面的标签代码粘贴到该字段并保存
由于不需要碰任何主题文件，如果你是第一次操作，这是最安全的选择。
方法二：代码插入插件
如果你的主题没有页头字段，可以使用像 WPCode（原名 Insert Headers and Footers）这样的插件。
- 在插件页面搜索并安装 WPCode 等代码插入插件，然后启用它
- 打开插件设置，找到“页头（Header）”字段
- 粘贴上面的标签代码并保存
这种方式的优势在于换主题后标签代码依然保留。如果你打算未来重新设计网站，这个方案很合适。
方法三（进阶）：在子主题中编辑 header.php
如果你熟悉直接编辑代码，可以将标签代码直接添加到主题文件中。
- 先为当前启用的主题创建一个子主题（直接编辑父主题，会导致下次主题更新时你的修改被清空——必须使用子主题）
- 打开子主题中的
header.php，将标签代码粘贴在wp_head()之前，或者粘贴在结束标签</head>之前 - 保存文件
如果你直接编辑父主题，下次主题更新时你的修改会被覆盖，标签代码也会随之消失。如果选择这种方法，请务必通过子主题进行修改。
如何确认安装真正生效
添加标签代码后，浏览你网站的几个页面。但重点在这里。
页面加载没有报错，并不代表追踪真的在正常工作。 即便浏览器控制台没有显示任何异常，一个拼写错误的站点密钥也可能导致数据完全没有传送到 HeatMapX。
唯一可靠的检查方式是打开 HeatMapX 仪表盘，在站点列表中找到你的网站，确认其计数确实增加了。访问几个页面后，如果计数在增加，说明安装成功。
常见问题
问：这会拖慢我的网站速度吗？ 答：该标签代码是异步加载且体积很小，对页面加载速度的影响微乎其微。
问：我在使用缓存插件，有什么需要注意的吗？ 答：如果你使用 WP Super Cache 或 W3 Total Cache 等缓存插件，添加标签代码后请务必清除（刷新）缓存。如果系统持续提供旧的缓存版本，新添加的标签代码将不会生效。
问：我已经添加了标签代码，但仪表盘中的计数没有增加 答：最常见的原因是站点密钥不匹配——粘贴了其他站点的密钥，或者复制时漏掉了某个字符。请对照 HeatMapX 仪表盘中的密钥仔细核对。
结语
在 WordPress 中添加热力图，归根结底就是粘贴一行代码。HeatMapX 可以免费开始使用，不妨试一试，看看访客究竟是如何体验你的网站的。