The Scroll Progress extension displays a horizontal progress bar to indicate the distance scrolled on the pages in your Evolve course.
This article provides an overview of the Scroll Progress extension, extension setup and provides examples of Scroll Progress extension configurations.
The Scroll Progress extension displays a horizontal progress bar to indicate distance scrolled on the course pages. A variable can also be used to control the progress bar indicator.
You enable the Scroll Progress extension in the Extensions section in your Evolve course.
Extension set up
To enable the Scroll Progress extension in your Evolve course, press the Extensions button in the top left and select Scroll Progress.
In the Behavior section:
- Toggle to enable the setting Display on Menus. Enabling this will show scroll progress on menus.
- Toggle to enable the setting Display on Extensions. Enabling this will show scroll progress on extensions with pages like the About extension and the Glossary extension.
- Toggle to enable Set Scroll Progress Based on Variable.
With the setting Set Scroll Progress Based on Variable enabled, the progress bar will be controlled by the value of the selected variable.
- Select Variable or Create Variable.
- Enter Max Variable Value. By default, this is set to 0 (zero).
In the Appearance section, you see that the appearance options for the Scroll Progress extension are available in the theme.
Below is an example that illustrates the Scroll Progress extension setup:
Example 1 – displays the Scroll Progress extension bars in an Evolve course. The Scroll Progress is shown in green for those pages that are scrolled partly or full.
Did this article help?
Let us know by leaving a star rating or review at the top of this article.