如何设置 WordPress 热图（两种简单方法）

我刚开始搭建 WordPress 网站的时候，基本上都是靠猜测来判断访客想要什么。直到我开始使用热图，才真正了解用户是如何与我的网站互动的——他们点击了哪里，滚动了多少页面，以及什么内容真正吸引了他们的注意力。

如果您正在尝试改进您的 WordPress 网站，但不确定哪些有效哪些无效，那么热图可以为您提供一些答案。

经过多年的测试，我最终确定了在 WordPress 中设置热图的两种简单方法：Microsoft Clarity 和 UserFeedback。

在本指南中，我将一步一步地讲解每个设置过程。最后，您将拥有所需的工具，可以根据数据驱动的方式对您的网站进行更改。🔥

为什么需要设置 WordPress 热图？

热图是一种可视化工具，可以准确地显示访客如何与您的WordPress 网站互动。它使用颜色编码来突出显示页面上最活跃和最不活跃的区域：

红色、橙色和黄色（“热点”区域）显示访客点击、轻触或停留时间最长的区域。

蓝色和绿色（“冷”区域）表示很少或完全没有受到关注的地方。

通过将这些活动绘制成图表，您就可以不再猜测哪些有效、哪些无效。换句话说，热图通过提供清晰的访客行为洞察，帮助您消除猜测。

它们可以帮助你解答一些重要问题，例如：

1.人们会点击你的行动号召按钮吗？

2.他们是否向下滚动到足以看到你的内容？

3.他们是不是点击了一些没有任何作用的东西？

有了这些信息，你就可以对网站进行明智的修改。你会知道哪些内容需要修复，哪些内容需要移动，以及哪些内容需要改进。

你可以利用这种洞察力来获得更多读者、提高销售额或增加潜在客户的咨询量——所有这些都只需根据人们实际使用你网站的方式进行简单的更改即可。

在接下来的章节中，我将分享如何使用两款最佳的热图添加工具来设置 WordPress 热图。其中一款完全免费，另一款是提供额外功能的付费版本。

您可以使用下面的跳转链接前往您偏好的方式：

步骤 0：准备 WordPress 网站以使用热图

方法一：使用 Microsoft Clarity（免费）设置 WordPress 热图

方法二：使用 UserFeedback 设置 WordPress 热图（最适合热图 + 用户调查）

额外步骤：最大化利用热图洞察 🔥

步骤 0：准备 WordPress 网站以使用热图

在向 WordPress 网站添加热图之前，务必确保网站已做好充分准备。采取一些预防措施可以帮助您避免在开始过程中出现任何问题。

如果你是第一次在正式网站上添加热图，明智的做法是先在测试网站上测试所有内容。

测试网站本质上是您正式网站的副本，您可以在其中进行更改和测试新功能，而不会影响您的真实网站。它使您能够安全地试用热图等新工具，而不会对用户体验造成任何干扰。

然后，您只需将更改推送到线上，即可将其应用到您的真实网站。

如果您使用Bluehost，那么您可以轻松创建一个测试站点，这要归功于他们快捷的一键式解决方案。

也就是说，如果您无法通过主机访问测试环境，那么您也可以使用WP Stagecoach等插件来创建测试站点。

如需完整步骤，您可以查看我们关于如何为 WordPress 创建测试站点的指南。

此外，在进行任何重大更改之前，务必备份您的网站。备份可以确保，万一在设置过程中出现任何问题，您可以轻松地将网站恢复到之前的状态，而不会丢失任何重要数据。

最后，请记住，热图与其它分析工具和用户反馈结合使用效果最佳。

将它们视为发现潜在问题或机遇的起点，而非唯一的信息来源。将热图分析结果与更广泛的数据相结合，可以让你更清晰、更准确地了解访客如何与你的网站互动。

方法一：使用 Microsoft Clarity 设置 WordPress 热图

Microsoft Clarity是一款免费且易于使用的热图和会话录制工具，可与 WordPress 无缝集成。它最适合进行网站整体分析，是希望了解访客行为的初学者、博主和小企业主的理想之选。

因此，我们在一些合作伙伴网站上使用它来跟踪热图并深入了解用户互动情况。

步骤 1：创建免费的 Microsoft Clarity 帐户

要使用 Microsoft Clarity 设置 WordPress 热图，您首先需要一个帐户。

访问Microsoft Clarity 网站，然后点击“开始使用”。

在弹出的窗口中，您会看到可以使用 Microsoft、Facebook 或 Google 帐户注册。只需点击您喜欢的帐户即可。

在本教程中，我将选择“登录 Google”。

之后，您可以选择合适的账户，完成注册流程。

然后，在确认页面上点击“继续”。

注册时，您将被要求确认您的电子邮件地址。

请务必在继续操作前查看 Clarity 使用条款并勾选复选框。

然后系统会提示您为您的 WordPress 网站创建一个新项目。

你只需要给你的项目命名，输入你的网站网址，然后从下拉菜单中选择你的行业即可。

完成上述步骤后，点击“添加新项目”即可完成设置。

完成这些步骤后，您现在可以安装 Microsoft Clarity WordPress 插件，在您的网站上设置热图。

步骤 2：在您的 WordPress 网站上安装 Microsoft Clarity

在此步骤中，您将安装 Microsoft Clarity 插件并将其连接到您刚刚创建的帐户。

从 WordPress 控制面板，我们转到“插件”»“添加新插件”。

使用搜索栏快速查找 Microsoft Clarity 插件。

只需在相关搜索结果中点击“立即安装”，然后在出现的“激活”按钮上再次点击即可。 

插件激活后，下一步是选择一个 Clarity 项目来连接这两个工具。

您可以从 WordPress 管理区域导航到Clarity，然后从下拉菜单中选择您刚刚创建的项目。

接下来的几秒钟内，您应该会看到“项目集成成功”的通知。

更多详情，请参阅我们关于如何在 WordPress 中安装 Microsoft Clarity Analytics 的指南。

💡注意：如果您使用了 WordPress 缓存插件，则需要在将 Microsoft Clarity 连接到您的网站后清除 WordPress 缓存。这一点非常重要，否则 Microsoft 将无法在几个小时内验证您的网站。

步骤 3：在 Microsoft Clarity 中设置热图

连接 Microsoft Clarity 后，它将自动开始跟踪您的访客——无需手动粘贴任何代码或修改主题文件。

在 Clarity 控制面板中，您可以找到有用的报告，这些报告可以概览人们如何与您的 WordPress 博客或网站互动。

一些关键指标包括：

1.会话数——这显示了您的网站获得了多少次独立访问。

2.每会话浏览页数– 显示访问者在一次会话期间浏览的页面数量。

3.滚动深度——显示用户在每个页面上向下滚动的距离。

4.活跃时间– 跟踪用户积极参与页面互动的时间（不仅仅是将其在后台标签页中打开）。

你还会发现一些预置的小部件，例如“用户概览”，它会突出显示访客类型和设备。

此外，还有一些行为洞察，例如愤怒点击（用户因沮丧而反复点击）和过度滚动（用户滚动过多，可能是在寻找某些东西）。

要查看热图，请切换到“热图”选项卡。

进入后，您将看到 Clarity 自动记录的所有页面热图列表。

只需点击您想要分析的页面即可。

打开热图后，你会看到三个主要视图：点击、滚动和注意力。

您可以切换到“点击”视图，查看访客点击最多的位置。

要查看滚动深度，只需切换到“滚动”选项卡即可。

在这里，Clarity 会显示用户在页面上的滚动距离。这有助于确定他们是否错过了关键内容。

最后，点击“注意力”按钮，查看访客在页面不同部分停留的平均时间。

红色区域表示关注度较高，蓝色区域表示关注度较低。

好了，就这些——您已成功使用 Microsoft Clarity 设置 WordPress 热图！

方法二：使用用户反馈设置 WordPress 热图

MonsterInsights 的 UserFeedback将热图式反馈与调查问卷和高级定向功能相结合。对于需要更深入洞察和更有效地收集访客反馈的成长型网站、在线商店和代理机构而言，它是一个强大的选择。

在 WPBeginner，我们使用 UserFeedback 来深入了解我们的网站设计客户的需求和期望。我们使用 UserFeedback 的体验非常棒，您可以查看我们完整的 UserFeedback 评测，了解我们为什么推荐它！

步骤 1：安装并激活 UserFeedback

首先，您需要注册一个 UserFeedback 帐户。您可以访问UserFeedback 网站并注册一个套餐来完成此操作。

注册账号后，您将被重定向到 UserFeedback 账号控制面板，在那里您可以找到 UserFeedback zip 文件的下载链接和您的许可证密钥。

现在，是时候安装插件了。

在 WordPress 控制面板中，您需要转到“插件”»“添加新插件”。

在下一个屏幕上，我们来搜索用户反馈。

然后，您可以像安装其他 WordPress 插件一样安装并激活该插件。

第一次安装插件？这里有一份关于如何安装 WordPress 插件的详细指南。

激活后，您可以输入许可证密钥来解锁套餐包含的所有专业功能。

为此，您可以导航至UserFeedback » 设置。然后，只需将您的许可证密钥从 UserFeedback 控制面板复制并粘贴到“许可证密钥”字段中即可。

请点击“验证”按钮开始验证过程。

几秒钟后，您应该会看到验证成功的消息。

步骤 2：启用热图插件

现在，让我们前往“用户反馈”»“插件”安装热图插件。

您只需向下滚动页面找到热图插件，然后在相应的框中点击“安装插件”即可。

安装完成后，请点击“激活”按钮将其激活。

步骤 3：创建新的热图

启用热图插件后，您现在可以创建网站的热图。

让我们转到WordPress 控制面板中的“用户反馈”»“热图”，然后单击“新建热图”按钮。

在弹出的窗口中，展开下拉菜单选择要跟踪的特定页面。例如，您可以为首页、着陆页或博客文章创建热图。

点击“创建”按钮即可设置热图。

步骤 4：查看热图结果

创建热图后，UserFeedback 将立即开始收集用户数据。

让我们前往“用户反馈”»“热图”，然后点击热图以查看详细的可视化分析。

在下一个屏幕上，您将能够查看有关访客的详细信息，包括：

1.设备筛选器– 比较用户在台式机、平板电脑和移动设备上的行为。

2.点击量– 准确查看用户在您的页面上的点击位置。

3.鼠标移动——跟踪用户如何在屏幕上移动鼠标。

如果您通过多个渠道推广您的网站，那么您还可以按 UTM 参数（例如广告系列、来源或媒介）筛选数据。这有助于您了解来自不同营销渠道的访客如何与您的网站互动。

就是这样——您已成功使用 UserFeedback 设置 WordPress 热图！

额外步骤：最大化利用热图洞察 🔥

只有当你知道如何根据热图所揭示的信息采取行动时，热图才真正有用。以下是如何将热图洞察转化为 WordPress 网站实际改进的方法。

修复访客流失点

您可以使用滚动图来查看访客在页面上的浏览深度。如果重要内容被埋藏在页面底部太深，那么大多数人可能永远看不到它。

您可以尝试将关键元素（例如行动号召或优惠信息）移至页面更上方，并将过长的页面拆分成更小的版块并使用清晰的标题。您还可以使用日期筛选器来跟踪这些更改如何随时间推移影响访客行为。

这个小小的改变就能降低跳出率，让访客停留更长时间。

发现并解决用户困惑

有时，访客会尝试点击无法点击的图片、图标或文字。这表明他们感到困惑或期望看到不同的内容。

您可以查看点击图和鼠标移动轨迹来找出这些区域。如有必要，您可以链接这些图像或在附近添加按钮，以便用户更轻松地操作。

您还可以使用 UserFeedback 设置快速调查，询问用户希望找到什么。

识别并修复导航问题

如果您发现访客经常在没有明确指引的情况下在页面之间跳转，这表明您的导航可能令人困惑。

简化导航，确保信息易于查找，并调整任何可能造成混淆的内容。您还可以像首次访问者一样，逐步演示网站上的重要步骤，以确保一切功能正常。

您可能还想查看我们关于如何在 WordPress 中创建自定义导航菜单的指南。

确保您的行动号召按钮绝对不会被错过

如果您的CTA（行动号召按钮）点击率不够高，我建议您调整其颜色、文本或位置，使其更加醒目。

利用鼠标移动分析功能，在点击之前发现用户犹豫的情况，并检查设备筛选器，以确保您的 CTA 在所有设备（尤其是移动设备）上都可见且易于点击。