Type: Pro
Purpose: Shows a slide-in “Up Next” bar when a reader has scrolled through most of an article, recommending the next piece of content at the moment they’re most likely to continue reading.
What It Does
When a reader scrolls past a configurable threshold (default: 80% of the article), a compact bar slides in — typically from the bottom of the screen — suggesting the next article to read. It’s a low-friction, non-intrusive prompt that appears at exactly the right moment: when the reader is nearly done and open to what comes next.
The recommended article is chosen based on semantic similarity, not a simple “next post by date” approach.
How It Works
Supercharger monitors scroll depth with a lightweight JavaScript listener. When the threshold is crossed, it displays a pre-rendered recommendation bar. The recommended post is determined using the vector index.
The bar can be dismissed by the reader, and it won’t reappear on the same post during the same session.
Requirement
This module requires the content index to be populated. See Understanding Indexing.
Settings
| Setting | Description | Default |
|---|---|---|
| Scroll Threshold | Percentage of the article scrolled before the bar appears (0–100%) | 80% |
| Widget Title | Label displayed in the bar | UP NEXT |
Display
The Up-Next bar appears as a fixed-position element at the bottom of the viewport. It slides in from the bottom when the threshold is crossed. It contains:
- A heading label (default:
UP NEXT) - The recommended article’s title
- A link to the article
- A dismiss button
The bar automatically hides when the reader scrolls back up, so it doesn’t obstruct the reading experience. It disappears if dismissed and won’t reappear for the same post in the same session.
The widget is rendered via wp_footer with a data-scroll-threshold attribute that the JavaScript uses to determine when to trigger.
The bar uses the CSS class supercharger-up-next.
Tips
- A threshold of 75–85% is ideal. Too low (e.g., 30%) and it interrupts reading; too high (e.g., 95%) and many readers will have already left.
- This module pairs well with [AI Exit-Intent Recirculation](ai-exit-intent-recirculation.md) — Up-Next catches engaged readers near the end of content, while exit-intent catches those who are about to leave.
- The bar is designed to be unobtrusive. If it feels too prominent for your site, adjust the styling via the
supercharger-up-nextCSS class.