WP Reading Progress


The reading progress bar is a great user experience on longreads. Especially if it accurately depicts the reading progress in the article text, and nothing else. This is standard on single blog posts and enabled by default.


  • Location top of screen, bottom of screen or below a sticky menu

  • Choose color of the reading progress bar

  • Have the bar start at 0% even when part of the article is visible

  • Select post types you wish the bar to appear, or individual posts


  • The reading progress bar has smooth initializing since part of the text may already be visible, after that a lightweight update-function ensures quick response while scrolling

  • When the sticky menu disappears during resizing or scrolling the progress bar automatically defaults to displaying at the top of the screen

  • If there is no single article identified (by class names or id) it uses the whole page to calculate progress

  • Attachment to a sticky element can be either absolute (default) or relative (use the checkbox in settings)

This is my 6th WordPress plugin but my first one freely available to everybody. I hope you enjoy using it as much as I enjoy building it!


  • css classes ‘ruigehond006’ and ‘progress’ are scheduled for removal in a next version, if you target the bar in css use ‘#ruigehond006_inner’.

Joeri (ruige hond)


  • Example of the reading progress bar on my photography blog
  • WP Reading Progress settings page
  • Activate the bar for an individual post (if that post type is not enabled)


  1. Install the plugin by clicking ‘Install now’ below, or the ‘Download’ button, and put the WP-reading-progress folder in your plugins folder

  2. By default it only works on single blog posts and uses an orange colour

  3. Go to settings->WP Reading Progress to customize it

Upon uninstall WP Reading Progress removes its own options and post_meta data (if any) leaving no traces.


2021 年 3 月 11 日
This Plugin works fine with Generatepress Theme. If u use the sticky navigation, then u can set: ".navigation-stick" in the top field and it works.
2020 年 11 月 25 日
Maybe someone find it helpful: if you are using WordPress and an Avada-Theme and you try to arrange the WP Reading Progress-Bar under a sticky menu insert ".fusion-header" and there you go... BIG BIG thanks to Joeri. He replied super fast and helped me fixing my issue. Great plugin, super useful and easy to manage. Cheers, Phil
2020 年 5 月 17 日
Out of all of the progress bar plugins I could find, this is one only one which fulfilled all of my needs and is super lightweight!! I messaged the developer with a couple of specific queries, and his response was faultless. He went out of his way to help! I am very grateful and can't recommend enough. Thanks again Jeori.
閱讀全部 10 則使用者評論


以下人員參與了開源軟體〈WP Reading Progress〉的開發相關工作。


WP Reading Progress 外掛目前已有 6 個本地化語言版本。 感謝全部譯者為這個外掛做出的貢獻。

將 WP Reading Progress 外掛本地化為台灣繁體中文版


任何人均可瀏覽程式碼、查看 SVN 存放庫,或透過 RSS 訂閱開發記錄


1.3.7: added aria-role and aria-value updating for screenreaders

1.3.6: moved css to head to avoid render blocking, added option ‘no css’ if you want to handle it yourself

1.3.5: improved get top position custom function to include edge cases, debounced resize event

1.3.4: removed jQuery dependency

1.3.3: fixed implode deprecated notice

1.3.2: fix getBoundingClientRect does not work on iOS 8 and 9 (at least), now using custom function for it

1.3.1: some optimizations regarding the on scroll function

1.3.0: now positions itself snugly to element using top-margin or fixed automatically to top when element is not in viewport or gone

1.2.5: improved fallback for mobile, added rtl support (html tag must contain dir=”rtl”)

1.2.4: added regular post type to settings, added fallback find post by id when not found by class names, added option to display on specific posts only

1.2.3: fixed bug initializing window height to 0 on page load in some cases

1.2.2: increased compatibility with themes regarding looking for single article

1.2.1: added option to start bar at 0%, slightly optimized progress function

1.2.0: improved behaviour upon resize of the window

1.1.0: now identifies single post reading area for all post-types, fallback to body when not found in DOM

1.0.3: fixed translation, corrected license indication

1.0.2: translated to Dutch

1.0.1: minified javascript and css, fixed issue of bar sometimes momentarily disappearing on mobile device while scrolling

1.0.0: release