Reading bar
Everything useful on a post page sits at the top or the bottom. A reader halfway through a long article has none of it within reach.
The reading bar keeps those tools on screen for the whole article, so they can be used from any point in the text without scrolling back.
It is at VerbaTheme OptionsSingle PostGeneral, group Reading Bar, and it is off by default.
#The bar itself
Shows a slim bar along the bottom of the screen while somebody reads the post.
Which screen widths it appears on.
How far above the bottom edge it sits.
Which surface it is painted on. Default, secondary, accent, inverted, or custom.
Used only by the custom style.
#Reading progress
How far through the article the reader is.
A ring, a percentage, or both.
Where the progress starts counting.
Counting from the article text is more honest on posts with a large header, because it does not credit the reader for scrolling past an image. Counting from the header matches what the eye sees on the page. Pick by how big your headers are.
#Reading tools
Lets readers make the article text larger.
How far it can grow.
Has the article read aloud.
A speed button next to listen.
Reading aloud is done by the reader browser, not by an external service. The voice depends on their operating system, so it will sound different on a Mac and on an Android phone, and some systems have better voices for some languages than others.
The share row and the summarize row appear in the bar too, when you have placed them there. See Sharing and Summarize with AI.
#Media controls
The most useful part, and the reason to turn the bar on for a media-heavy site.
Puts the post media controls in the bar once the media scrolls away.
Play, pause, and mute the header video from the bar.
Opens the header video in the shared full-screen overlay.
Keeps an audio player in the bar on audio and podcast posts.
The scenario that explains it: a podcast episode with a transcript. The reader scrolls into the text, the player follows them down the page instead of disappearing, and they listen while they read.
Galleries behave the same way, with the position, the arrows, and full screen moving into the bar.
Does the bar cover content on a phone?
It sits above the bottom edge with a configurable gap and stays slim. Check it on a real phone with your own article, especially if you also run a cookie banner or a floating card at the bottom.
Can I have the bar without the progress ring?
Yes. Turn off show reading progress and the bar keeps only the tools.
The media controls do not appear
Post format controls is off by default, so turn it on. The controls also only take over once the header media has scrolled off screen; while it is visible you use the media itself.
Last updated
Was this article helpful?
- Basic settings in the Customizer
- Set up dark mode
- Theme Options: the advanced settings panel
- General: site behavior
- General: optimization
- SPA and page transitions
- Content zones and insertions
- Blog: how posts are presented
- Before you go: the exit-intent banner
- Floating card: a post that follows the reader
- Marketing surfaces and analytics
- Accessibility settings
- Object-level settings
- Category fields
- Tag fields
- Author profile fields
- Page fields and per-page layout
- Post fields
- Widget areas
- Writing a post in Verba
- Post formats
- Building a post from a block pattern
- Building a post with an Elementor template
- Post header styles
- Reading aids: how the four blocks work
- TL;DR summary
- Key points
- Table of contents
- Summarize with AI
- Reading bar
- Sharing: placements, styles, and copy link
- The share block in the post footer
- Continuous reading: the next post without a click
- Likes, views, and comment voting
- Related posts and read also
- Sources and citations
- Splitting a long post across several pages
- Comments
- Formatting the body of an article
Resources
On this page
