Articles on: The editor

Scroll indicator

A scroll indicator is a bar that fills as visitors scroll, showing how far through the page or scene they are. You add it as an element in the editor, choose what it tracks and which way it fills, and style it in the right panel.


Adding a scroll indicator


To add a scroll indicator to a scene:


  1. In the editor, open the Add elements drawer in the left panel.
  2. Select the Specials category.
  3. Drag Scroll Indicator onto the canvas.
  4. Drag the handles of the scroll indicator to set its size.


A new scroll indicator tracks the whole page and fills horizontally. You can change both in its settings.


Choosing page or scene progress and direction


The scroll indicator's settings decide what it tracks and which way it fills. To change them:


  1. Select the scroll indicator on the canvas.
  2. In the right panel, click Settings in the Scroll Indicator block.
  3. Under Spread/scene, choose Page or Scene.
  4. Under Direction, choose Horizontal or Vertical.


The options work as follows:


  • Page: The bar fills as the visitor scrolls through the whole page. This is the default.
  • Scene: The bar fills as the visitor scrolls through the scene the scroll indicator sits in. It starts filling when the top of the scene reaches the top of the screen, and it is full when the bottom of the scene reaches the bottom of the screen. Use this option in a scene that is taller than the screen; in a shorter scene the bar can't fill gradually.
  • Horizontal: The bar fills from left to right. This is the default.
  • Vertical: The bar fills from top to bottom.


The scroll indicator shows the visitor's position only. It does not measure reading speed.


Styling the scroll indicator


A scroll indicator has two layers: a background track and an indicator that fills on top of it. To set its size, select it on the canvas and drag its handles. To style it, select it and use the Styling section in the right panel, which has three items:


  • Background: The background colour, border and rounding of the track.
  • Padding: The space between the track and the indicator.
  • Indicator: The colour, border and rounding of the filling bar.


Keeping the scroll indicator on screen


By default, a scroll indicator scrolls away with the rest of the scene. To keep it visible while visitors read, make it sticky:


  1. Place the scroll indicator directly in a Longpage scene, not inside a group.
  2. Select the scroll indicator. At the top of the right panel, click the position menu, which shows the current position type, such as Free position. The Position element flyout opens.
  3. Turn on Sticky.
  4. If Free position is selected, choose Top, Center or Bottom to set where on the screen it stays. With Screen border selected, the element stays at the screen border position you chose.
  5. Optionally, enter a value in Sticky for. For Top and Bottom, you can also enter a Margin. For what these settings do, see Element positioning.


Sticky is only available for elements placed directly in a Longpage scene. It can't be turned on in other scene types or for an element inside a group.


Frequently asked questions


Why does my scroll indicator scroll out of view?


A scroll indicator scrolls away with the scene unless it is sticky. To keep it on screen, select it, click the position menu at the top of the right panel (it shows the current position type, such as Free position) and turn on Sticky. This works only when the scroll indicator sits directly in a Longpage scene.


Why can't I turn on Sticky for my scroll indicator?


Sticky is only available for elements placed directly in a Longpage scene. If the scene is another type, or the scroll indicator is inside a group, the Sticky option is unavailable. Move the scroll indicator out of the group, or use a Longpage scene.


Why does the scroll indicator look partly filled in the editor?


In the editor, the scroll indicator shows a fixed partial fill so you can see its styling. It shows the visitor's real scroll progress when you preview the publication and on the published page.


Do screen readers announce the scroll indicator?


No. The scroll indicator is decorative and is hidden from screen readers.

Updated on: 20/10/2026