Want to add a reading progress bar to WordPress?
A reading progress bar is a great way to improve your site’s user experience by giving readers a visual indicator of their progress through a post.
If you want to add one to your site, there are a ton of great free or affordable plugins that help you add a progress bar and match its design to the rest of your site.
In this post, we’ve collected 8 of the top options, 6 of which are completely free.
Below, we’ll share details for each plugin, along with a quick introduction to how progress bars work and why they can be beneficial to your site.
What Is a Reading Progress Bar?
A reading progress bar does pretty much exactly what the name says – it lets your site’s visitors see how far they’ve progressed through the content of your post.
Typically, you’ll stick a horizontal bar to the top or bottom of the page. As users scroll through the post, the bar will “fill up” to indicate how close they are to the end of the content.
Some plugins also give you the option to create a vertical progress bar on the left or right of the content. In these cases, it looks almost like a scroll bar. However, the key difference is that the progress bar will be based on the length of the actual content, whereas the browser scroll bar is based on the full length of the page.
Here are two real examples of the typical way that sites use reading progress bars…
HubSpot adds an orange progress bar that appears directly below its sticky header:
However, you can experiment with different progress bar placements depending on your site.
Why Add a Reading Progress Bar to WordPress?
At a high level, a reading progress bar is a way to improve the usability and user experience on your site, which can have more direct effects on important metrics such as time on page and bounce rate.
First, let’s talk about user experience in general.
Most people want to know what they’re getting into before investing the time to engage with your post. Is it a 5-minute article they can read in between tasks or is it a lengthy 20-minute article that will require some serious focus?
A progress bar gives readers a good idea of what to expect from your post as they start reading. To help with this, some sites also add an estimated reading time in addition to the progress bar, which several of the plugins below support.
Once your visitors start reading, the progress bar can also encourage them to finish the post. For example, if a reader sees that they’ve already made it through 80% of the content, they’ll be encouraged to finish the last 20% because they’ve already made it through most of the post.
These improvements in user experience can have positive effects on two key metrics:
- Dwell time – by encouraging readers to finish a post once they’ve started reading, you can increase the time that they spend on the page.
- Bounce rate – by increasing the time that visitors spend on your page, you’ll increase the chance that a visitor will continue to engage with your site (maybe by reading another post), which can help reduce your bounce rate.
If you combine progress bars with other user experience-boosting tactics such as quality navigation structure and smart use of pagination, you can create a really nice, engaging experience for visitors.
8 Best Reading Progress Bar WordPress Plugins
Now, let’s get into the 8 best progress bar WordPress plugins to help you add a reading progress bar to your site.
While you can find generic progress bar plugins that let you create a custom progress bar for anything, this post is specifically focused on plugins that add reading progress indicators based on the length of a page’s content.
In terms of pricing, 6 of these plugins are completely free, while the 2 remaining plugins are affordable and add some extra flexibility that you won’t find in most of the free options.
Best of all, all of these plugins should work with pretty much any WordPress theme.
Read Meter
Read Meter is a reading progress bar plugin from Brainstorm Force, the same team behind the popular Astra WordPress theme (which made our list of the fastest WordPress themes).
The plugin lets you automatically add a reading progress bar that sticks to the very top or bottom of the page. You also have the option to display the post’s estimated reading time along with the progress bar.
Here’s everything that you’ll get with Read Meter:
- Top or bottom placement – display the progress bar at the top or bottom of a user’s screen.
- Post type targeting – you can opt to only add the reading progress for certain post types (including custom post types). For example, you could display it on blog posts but not on pages.
- Read time – automatically add the estimated read time to various parts of the post (e.g. below the title) or manually place it using a shortcode.
- Customizable colors – you can customize the colors and style of every element to make it match your site.
Price: Read Meter is 100% free.
Reading progressbar
Along with Read Meter, Reading progressbar is another one of the most popular progress bar plugins at WordPress.org. Unlike Read Meter, however, this plugin does not give you an option to add the estimated reading time – it’s exclusively for the progress bar.
However, it does give you some extra targeting flexibility that Read Meter doesn’t offer. For example, you can target your progress bar to specific templates in addition to post-type targeting.
Here’s everything that you’ll get with Reading progressbar:
- Flexible positioning – you can automatically stick your progress bar to the top or bottom of the page. Or, there’s also a custom positioning option that lets you stick it to any CSS element. For example, if you have a sticky header, you could stick it below your header navigation menu instead of all the way at the top of the page (like the HubSpot example above).
- Customizable design – change the height and colors of your progress bar to match your site.
- Targeting options – you can only display your progress bar on certain templates and/or post types.
Price: Reading progressbar is 100% free.
Worth the Read
Worth the Read is one of the most customizable progress bar WordPress plugins, which makes it a great option if you find the previous plugins too limiting.
It includes some unique placement and targeting options that most other plugins don’t offer, along with some other unique touches. It also gives you the option to add an estimated reading time if preferred.
Here’s everything that you’ll get with Worth the Read:
- Horizontal or vertical positioning options – include a horizontal progress bar at the top or bottom of the screen OR a vertical progress bar on the left or right of the screen. The vertical option is unique as most other plugins don’t support it.
- Post type targeting – only include your reading progress bar on certain post types.
- Device targeting – you have the option to turn off the progress bar for mobile devices and tablets (or desktops).
- Comment progress – you have the option to include comments in the reading progress, which can be nice if you have active comments sections with useful information.
- RTL support – it’s one of the few plugins that lets you change to RTL, which can be great for sites in RTL languages.
- Style options – customize the colors, thickness, opacity, and so on. If you’ve enabled the comments, you can even use a separate color to indicate when the comment section begins on the progress bar.
- Estimated reading time – if you enable reading time, you can customize its functionality and place it automatically or manually using a shortcode.
Price: Worth the Read is 100% free.
Catch Scroll Progress Bar
Catch Scroll Progress Bar is another lightweight option for adding a basic progress bar to your site.
It keeps things pretty simple, with just the minimal options that you need to place and style your progress bar.
Here’s everything that you’ll get with Catch Scroll Progress Bar:
- Top or bottom position – stick your progress bar to the top or bottom of the page.
- Post type targeting – only add your progress bar to certain post types.
- Template targeting – within those post types, only display it on certain templates. For example, you could add it to single posts but not the archive page.
- Color and style options – customize the colors, opacity, and height of your progress bar.
Price: Catch Scroll Progress Bar is 100% free.
WP Reading Progress
WP Reading Progress is another free progress bar WordPress plugin that’s available at WordPress.org.
Like the previous plugin, it only gives you the minimal settings needed to customize your reading progress bar. But for most people, that’s all you need, which makes it another solid option.
Here’s everything that you’ll get with WP Reading Progress:
- Flexible positioning – automatically stick the bar to the top or bottom of the page. Or, you can manually stick it to any CSS selector.
- Post type targeting – only include a progress bar on certain post types. There’s also an option to enable/disable on archive pages.
- Style customization – you can customize the color and thickness of the progress bar. However, you only get to choose a single color and there are no options for opacity.
Price: WP Reading Progress is 100% free.
Reading Time
Reading Time is the first reading progress plugin on this list that only comes in a premium version.
However, it’s still quite affordable and offers lifetime updates via Envato’s CodeCanyon marketplace.
There are 2 main reasons that you might want to consider Reading Time over the free alternatives:
- 8+ preset styles – you get some unique style options, such as using vertical bars instead of a solid fill inside the progress bar (pictured above).
- Advanced targeting rules – beyond targeting post types and templates, you can target your progress bars by very specific rules such as user roles, URLs, devices, and more.
You also get all of the “standard” features that you’d expect from a plugin:
- Flexible positioning – in addition to automatic top or bottom placement, you can also use custom positioning to stick your progress bar to any CSS selector.
- Style options – beyond the 8+ preset styles, you also get general options to customize the colors and height of your progress bar.
Price: Reading Time costs $15, which comes with lifetime updates for a single site and 6 months of support.
Reading Position Indicator
Reading Position Indicator is another lightweight free progress bar plugin at WordPress.org.
It doesn’t give you a ton of settings, but one unique option is that it lets you use a custom gradient for your reading progress bar (in addition to a solid color).
Here’s everything that you’ll get with Reading Position Indicator:
- Top or bottom position – there’s no CSS selector targeting but you can add an offset.
- Post type targeting – target your progress bar to specific post types.
- Style customization options – choose from solid or gradient color styles. You can also adjust the thickness of the progress bar.
Price: Reading Position Indicator is 100% free.
ReBar
ReBar is another premium reading progress bar WordPress plugin that’s sold via Envato’s CodeCanyon marketplace.
As with Reading Time, here are some of the unique features that it offers that might make it worth spending the money:
- 8+ preset styles – you get a number of unique styles that go beyond solid color fills, such as plastic, gradients, iOS-style, and more.
- Advanced targeting rules – beyond targeting post types, you can target your progress bars by very specific rules such as user roles, URLs, devices, and more.
- Infinite scroll support – ReBar still works with infinite scroll layouts, which makes it a great option for those sites. You can define the scroll area based on CSS selectors and it will generate a unique progress bar for each post in the infinite scroll.
Here are some other notable features:
- Horizontal and vertical styles – place a horizontal progress bar at the top or bottom of the page OR place a vertical progress bar on the left or right side of the page.
- Customizable styles – in addition to the 8+ preset styles, you can also customize the colors and height/width of your progress bar.
- RTL support – you can reverse the progress bar for RTL languages.
Price: ReBar costs $15, which comes with lifetime updates for a single site and 6 months of support.
Summary
That wraps up our collection of the 8 best reading progress bar WordPress plugins.
For the simplest options to add a basic progress bar, you can consider plugins such as Read Meter or Reading progressbar.
On the other hand, if you want the most customizability for free, you might want to start with Worth the Read, as it includes a number of unique options and features that other plugins don’t offer.
If you want to go beyond a solid fill color for the progress bar, you also might want to consider the premium options at CodeCanyon – either Reading Time or ReBar. Again, the most unique details about these plugins are that both come with 8+ preset styles and much more advanced targeting options.
Each plugin has its own unique twist when it comes to the style and features, so it’s worth exploring them all to find the option that’s right for your site.
Most of them have free versions at WordPress.org, which makes it easy to test them. If you’re hosting your site with Kinsta, you can easily create a staging site to safely test how each plugin will look on your site.
Leave a Reply