Reading Progress Bar

This module displays a horizontal progress bar at the top of the page, showing how much content a user has read—also known as a Reading Position Indicator.

It is especially useful for content-heavy sites like blogs, tutorials, or documentation, where users benefit from seeing their reading progress in real time.

Additional features

• Accurately handles dynamic content with varying heights.
• Allows targeting a specific container for tracking reading progress, not just the entire document.
• Supports automatic hiding of the progress bar after a configurable delay when the user stops scrolling.
• The progress bar can be hidden automatically when the content height relative to the viewport height falls below a configurable threshold, avoiding unnecessary display on short pages.
• Dispatches custom JavaScript events that expose the reading progress in real time as a percentage, allowing developers to hook into and respond to user scroll behavior programmatically.

Usage

• Download and extract to the module folder or install it using composer.
• Navigate to path /admin/modules and enable the Reading Progress Bar module.
• Navigate to path /admin/structure/block and add a Reading Progress Bar block to the region of your choice.