How to Add a Circular Reading Progress Bar in WordPress?

Key Takeaways

  • Progress Tracker block from Nexter Blocks allows users to add a circular reading progress bar in WordPress.
  • Users can select 'Circular' from the Type section under the Style tab to customize the progress bar.
  • The Circle Position tab enables users to adjust the position and offset of the circular reading progress bar.
Table of Contents

Do you want to add a circular reading progress bar in WordPress? Adding a circular reading scroll progress bar can add a unique touch to your website compared to a traditional linear progress bar.

With the Progress Tracker block from the Nexter Blocks, you can easily add a circular reading progress bar in WordPress.

To check the complete feature overview documentation of the Nexter Blocks Progress Tracker block, click here.

Requirement  – This block is a part of the Nexter Blocks, make sure it’s installed & activated to enjoy all its powers.

To do this, add the Progress Tracker block from the Nexter Blocks to the page and follow the steps. 

1. Select Circular from the Type section under the Style tab.

progress tracker circular

From the Apply to section, you can select where to apply the progress bar to the entire page or a specific section.

From the Circle Position tab, you can adjust the position and offset of the progress bar.

Now you’ll see a circular reading scroll progress bar as you scroll the page.

About the Author

Photo of Aditya Sharma CMO of NexterWP
CMO at POSIMYTH Innovations · NexterWP · 7 years experience

He has spent years in the WordPress ecosystem building, breaking, and optimizing sites until they actually perform. He works at the intersection of speed, growth, and usability, helping creators ship websites that load fast and convert. An active WordPress community contributor sharing through tools, tutorials, and direct collaboration. Tested practice, not theory.

WordpressThemesElementorn8nAIClaudeAutomationServer

Share your Thoughts

Get Instant Answers to all your questions about Nexter Blocks,
Extensions & Theme trained on 1000+ Docs and Videos

Still in Doubt? Let’s Assist You

Have Feedback or Questions?

Join our WordPress Community on Facebook!

Related Frequently Asked Questions

What should I do if the circular reading progress bar isn't displaying?

If the circular reading progress bar isn't showing, ensure that the Progress Tracker block from Nexter Blocks is installed and activated. This block is essential for adding the progress bar. If it's activated but still not visible, check the settings under the Circle Position tab to confirm the position and offset are correctly set.

What is the best way to position the circular reading progress bar?

The best practice for positioning the circular reading progress bar is to use the Circle Position tab to adjust its position and offset. This ensures that the progress bar is visible and enhances the user experience as they scroll through your content.

Does the circular reading progress bar work with other page builders?

The circular reading progress bar is specifically designed to work with Gutenberg as the primary builder. While it may be compatible with Elementor and Bricks, the optimal experience is achieved using Gutenberg, as NexterWP is built primarily for it.

What happens after I add the circular reading progress bar?

After adding the circular reading progress bar, it will appear as users scroll through the page. This visual cue helps indicate how much of the content has been read, enhancing engagement and providing a modern touch to your website.

Are there any limitations when using the circular reading progress bar?

One limitation to consider is that the circular reading progress bar requires the Nexter Blocks to function. Without this block, you won't be able to implement the feature. Additionally, ensure that your theme supports the styling and functionality of the progress bar.

Last reviewed: April 14, 2026

Related Docs