阅读进度条是改善网站用户体验的好方法，它为读者提供了文章进度的视觉指示器。
如果您想向您的网站添加一个，有大量免费或负担得起的插件可帮助您添加进度条并将其设计与您网站的其余部分相匹配。
在这篇文章中，我们收集了8个热门选项，其中6个是完全免费的。
下面，我们将分享每个插件的详细信息，并简要介绍进度条的工作原理以及它们为何对您的网站有益。
什么是阅读进度条？
阅读进度条的功能几乎与名称所说的完全一样——它可以让您网站的访问者看到他们在您的文章内容中取得了多大的进步。
通常，您会将水平条粘贴到页面的顶部或底部。当用户滚动浏览文章时，该栏将“填满”以指示他们与内容结尾的距离。
一些插件还让您可以选择在内容的左侧或右侧创建垂直进度条。在这些情况下，它看起来几乎像一个滚动条。但是，关键区别在于进度条将基于实际内容的长度，而浏览器滚动条基于页面的全长。
以下是网站使用阅读进度条的典型方式的两个真实示例……
HubSpot添加了一个橙色进度条，直接显示在其固定顶部菜单栏下方：
HubSpot的阅读进度条示例
Thrive Themes有一个绿色的阅读进度条，它也出现在固定菜单栏下方：
Thrive Themes中的阅读进度条示例
但是，您可以根据您的站点尝试不同的进度条位置。
为什么要在WordPress中添加阅读进度条？
在较高的层次上，阅读进度条是提高网站可用性和用户体验的一种方式，它可以对重要指标产生更直接的影响，例如页面停留时间和跳出率。
首先，让我们谈谈一般的用户体验。
大多数人想知道他们在投入时间参与您的文章之前会进入什么领域。是他们可以在任务之间阅读的5分钟文章，还是需要认真关注的20分钟长文章？
进度条可以让读者在开始阅读时对您的文章有什么期望。为了帮助解决这个问题，一些网站除了进度条之外还添加了估计阅读时间，下面的几个插件都支持。
一旦您的访问者开始阅读，进度条也可以鼓励他们完成文章。例如，如果读者看到他们已经完成了80%的内容，他们会被鼓励完成最后 20% 的内容，因为他们已经完成了大部分文章。
用户体验的这些改进可以对两个关键指标产生积极影响：
- 停留时间——通过鼓励读者在开始阅读后完成一篇文章，您可以增加他们在页面上花费的时间。
- 跳出率——通过增加访问者在您的页面上花费的时间，您将增加访问者继续与您的网站互动的机会（可能通过阅读另一篇文章），这有助于降低您的跳出率。
如果您将进度条与其他提升用户体验的策略（例如高质量的导航结构和智能使用分页）结合起来，您可以为访问者创造一个非常好的、引人入胜的体验。
8个最佳阅读进度条WordPress插件
现在，让我们进入8个最佳进度条WordPress插件，以帮助您为您的网站添加阅读进度条。
虽然您可以找到通用进度条插件，让您可以为任何内容创建自定义进度条，但本文特别关注根据页面内容长度添加阅读进度指示器的插件。
在定价方面，其中6个插件是完全免费的，而其余2个插件价格合理，并增加了一些额外的灵活性，这是您在大多数免费选项中找不到的。
最重要的是，所有这些插件都应该适用于几乎任何WordPress主题。
Read Meter
Read Meter
Read Meter是Brainstorm Force的一个阅读进度条插件，Brainstorm Force是流行的Astra WordPress主题背后的同一个团队（这也是我们最快的WordPress主题列表）。
该插件可让您自动添加一个贴在页面顶部或底部的阅读进度条。您还可以选择显示文章的预计阅读时间以及进度条。
这是您使用Read Meter可以获得的所有内容：
- 顶部或底部放置– 在用户屏幕的顶部或底部显示进度条。
- 文章类型定位– 您可以选择仅添加某些文章类型（包括自定义文章类型）的阅读进度。例如，您可以将其显示在博客文章上，但不能显示在页面上。
- 阅读时间——自动将预计阅读时间添加到文章的各个部分（例如标题下方）或使用简码手动放置。
- 可自定义的颜色——您可以自定义每个元素的颜色和样式，使其与您的网站相匹配。
价格：Read Meter是100%免费的。
Reading progressbar
Reading progressbar
与Read Meter一起，Reading progressbar是WordPress.org上另一个最受欢迎的进度条插件之一。然而，与Read Meter不同的是，此插件不提供添加预计阅读时间的选项——它专门用于进度条。
但是，它确实为您提供了Read Meter所不提供的额外定位灵活性。例如，除了文章类型定位之外，您还可以将进度条定位到特定模板。
以下是阅读进度条的所有内容：
- 灵活的定位——您可以自动将进度条粘贴到页面的顶部或底部。或者，还有一个自定义定位选项，可让您将其粘贴到任何CSS元素上。例如，如果您有一个固定顶部菜单栏，您可以将其粘贴在标题导航菜单下方，而不是一直粘贴在页面顶部（如上面的HubSpot示例）。
- 可定制的设计– 更改进度条的高度和颜色以匹配您的网站。
- 定位选项——您只能在某些模板和/或文章类型上显示进度条。
价格：Reading progressbar插件100%免费。
Worth the Read
Worth the Read
Worth the Read是最可定制的进度条WordPress插件之一，如果您发现以前的插件过于局限，它是一个很好的选择。
它包括大多数其他插件不提供的一些独特的放置和定位选项，以及其他一些独特的功能。如果愿意，您还可以选择添加估计的阅读时间。
以下是值得一读的所有内容：
- 水平或垂直定位选项——包括屏幕顶部或底部的水平进度条或屏幕左侧或右侧的垂直进度条。垂直选项是独一无二的，因为大多数其他插件不支持它。
- 文章类型定位– 仅在某些文章类型上包含您的阅读进度条。
- 设备定位– 您可以选择关闭移动设备和平板电脑（或台式机）的进度条。
- 评论进度– 您可以选择在阅读进度中包含评论，如果您有包含有用信息的活跃评论部分，这可能会很好。
- RTL支持——它是少数几个可以让您更改为RTL的插件之一，这对于使用RTL语言的网站非常有用。
- 样式选项——自定义颜色、厚度、不透明度等。如果您启用了评论，您甚至可以使用单独的颜色来指示评论部分何时开始在进度条上。
- 预计阅读时间——如果您启用阅读时间，您可以自定义其功能并使用简码自动或手动放置。
价格：Worth the Read是100%免费的。
Catch Scroll Progress Bar
Catch Scroll Progress Bar
Catch Scroll Progress Bar是另一个轻量级选项，用于向您的站点添加基本进度条。
它使事情变得非常简单，只需放置和设置进度条样式所需的最少选项。
以下是使用Catch滚动进度条获得的所有内容：
- 顶部或底部位置– 将进度条粘贴到页面的顶部或底部。
- 文章类型定位– 仅将您的进度条添加到某些文章类型。
- 模板定位——在这些文章类型中，仅在某些模板上显示。例如，您可以将其添加到单个文章，但不能添加到存档页面。
- 颜色和样式选项——自定义进度条的颜色、不透明度和高度。
价格：Catch Scroll Progress Bar是100%免费的。
WP Reading Progress
WP Reading Progress
WP Reading Progress是另一个免费的进度条WordPress插件，可在WordPress.org上找到。
与之前的插件一样，它只为您提供自定义阅读进度条所需的最少设置。但对于大多数人来说，这就是你所需要的，这使它成为另一个可靠的选择。
这是您将通过WP Reading Progress获得的所有内容：
- 灵活的定位– 自动将栏粘贴到页面的顶部或底部。或者，您可以手动将其粘贴到任何CSS选择器。
- 文章类型定位– 仅在某些文章类型上包含进度条。还有一个选项可以在存档页面上启用/禁用。
- 样式自定义——您可以自定义进度条的颜色和粗细。但是，您只能选择一种颜色，并且没有不透明度选项。
价格：WP Reading Progress是100%免费的。
Reading Time
Reading Time是此列表中第一个仅提供高级版本的阅读进度插件。
但是，它仍然相当实惠，并通过Envato的CodeCanyon市场提供终身更新。
您可能需要考虑阅读时间而不是免费替代品，主要有两个原因：
- 8种以上的预设样式——您可以获得一些独特的样式选项，例如在进度条内使用垂直条而不是实心填充（如上图所示）。
- 高级定位规则——除了定位文章类型和模板之外，您还可以通过非常具体的规则（例如用户角色、URL、设备等）来定位进度条。
您还可以获得插件所期望的所有“标准”功能：
- 灵活的定位——除了自动顶部或底部放置，您还可以使用自定义定位将进度条粘贴到任何CSS选择器。
- 样式选项——除了8种以上的预设样式之外，您还可以获得自定义进度条颜色和高度的常规选项。
价格：Reading Time费用为15美元，附带单个站点的终身更新和6个月的支持。
Reading Position Indicator
Reading Position Indicator
Reading Position Indicator是WordPress.org上的另一个轻量级免费进度条插件。
它不会为您提供大量设置，但一个独特的选项是它允许您为阅读进度条使用自定义渐变（除了纯色）。
这是阅读位置指示器所获得的一切：
- 顶部或底部位置– 没有CSS选择器定位，但您可以添加偏移量。
- 文章类型定位– 将您的进度条定位到特定的文章类型。
- 样式自定义选项——从纯色或渐变色样式中进行选择。您还可以调整进度条的粗细。
价格：Reading Position Indicator是100%免费的。
ReBar
ReBar
ReBar是另一个高级阅读进度条 WordPress 插件，通过Envato的CodeCanyon市场销售。
与Reading Time一样，以下是它提供的一些独特功能，可能值得花钱：
- 8种以上的预设样式——您可以获得许多超越纯色填充的独特样式，例如塑料、渐变、iOS样式等。
- 高级定位规则——除了定位文章类型之外，您还可以通过非常具体的规则（例如用户角色、URL、设备等）来定位进度条。
- 无限滚动支持——ReBar仍然适用于无限滚动布局，这使其成为这些网站的绝佳选择。您可以基于 CSS 选择器定义滚动区域，它将为无限滚动中的每个文章生成一个唯一的进度条。
以下是其他一些值得注意的功能：
- 水平和垂直样式——在页面顶部或底部放置一个水平进度条，或者在页面左侧或右侧放置一个垂直进度条。
- 可自定义的样式——除了8种以上的预设样式，您还可以自定义进度条的颜色和高度/宽度。
- RTL支持——您可以翻译RTL语言的进度条。
价格：ReBar售价15美元，附带单个站点的终身更新和6个月的支持。
小结
这总结了我们收集的8个最佳阅读进度条WordPress插件。
对于添加基本进度条的最简单选项，您可以考虑使用Read Meter或Reading progressbar等插件。
另一方面，如果您想免费获得最大的可定制性，您可能希望从Worth the Read开始，因为它包含许多其他插件不提供的独特选项和功能。
如果您想超越进度条的纯色填充颜色，您可能还需要考虑CodeCanyon的高级选项——Reading Time或ReBar。同样，这些插件最独特的细节是它们都带有8种以上的预设样式和更高级的定位选项。
每个插件在风格和功能方面都有自己独特的风格，因此值得一试，以找到适合您网站的选项。
评论留言