Reading bar - Verba

The single post Pro
This article covers functionality available to customers on the Pro version.

The reading bar keeps the post's tools on screen for the whole article, so a reader halfway through a long post can use them without scrolling back to the top or the bottom.

It's at VerbaTheme OptionsSingle PostGeneral, group Reading Bar, and it's off by default. The group appears once Single Post Source on the same tab is set to Advanced.

The reading bar with a progress ring at 53%, the text size and listen buttons, and a share button
The reading bar halfway through a post.

#The bar itself

Shows a slim bar along the bottom of the screen while somebody reads the post.

Which screen sizes it appears on.

How far above the bottom edge it sits.

Which surface it's painted on. Default, secondary, accent, inverted, or custom.

Used only by the custom style.

The bar waits while a cookie consent banner is on screen, since both use the same spot, and appears once the visitor answers it. It also steps aside after the reader scrolls past the end of the article, and comes back on the way up.

#Reading progress

How far through the article the reader is.

Ring and percentage, ring only, or percentage only.

Where the progress starts counting: the post header or the article text.

Counting from the article text is more honest on posts with a large header, because it doesn't 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's 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 menu and the summarize button appear in the bar too, when you've placed them there. See Sharing and Summarize with AI.

#Media controls

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 full screen.

Keeps an audio player in the bar on audio and podcast posts.

The position counter and the arrows for the header gallery.

Opens the header gallery full screen.

On a podcast episode with a transcript, the player follows the reader down the page instead of disappearing, so they can listen while they read. While audio or the listen narration plays, the bar stays open even past the end of the article.

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 floating card at the bottom. If it's too much on small screens, remove mobile from Show on.

Can I have the bar without the progress ring?

Yes. Turn off Show reading progress and the bar keeps only the tools.

The bar never appears

Check that the source is Advanced, that the current screen size is in Show on, and that a cookie banner isn't waiting for an answer. A bar with every part switched off doesn't show either.

The media controls don't appear

Enable 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's visible you use the media itself.

Last updated

Was this article helpful?

FIND THE ONE THAT FITS YOUR PROJECT

Import a demo, swap the content, adjust the layout. Modern WordPress under the hood, fast even when the site fills up.