B3 ScrollSpy Article
Getting Started
Activate ScrollSpy, choose a test page and target structure, select a style, and verify the frontend experience.
Start with one heading-rich page. Keeping the first rollout contained makes it easier to validate targeting, fixed-position layout, keyboard behavior, and mobile presentation before applying the experience elsewhere.
Browse docs
Activate and open the settings
Activate the plugin and open its WordPress settings workspace.
Install and activate B3 ScrollSpy as a WordPress plugin, then open its settings workspace. Keep a content-heavy page open in another tab so each targeting and style change can be checked against real headings.
- 1Install the plugin zip and activate B3 ScrollSpy.
- 2Open the B3 ScrollSpy settings screen in WordPress admin.
- 3Choose a real page with several headings as your first test page.
Choose pages and targets
Select where ScrollSpy runs and which page elements it follows.
Start with selected-page targeting so the first rollout stays contained. Then use the heading and include or exclude controls to keep the target list focused on meaningful sections rather than every matching element.
- Selected pages
- Enable the experience only where it has been reviewed against the page layout.
- Heading discovery
- Track the headings that represent the page structure readers should navigate.
- Include and exclude controls
- Narrow discovery when utility headings or unrelated page regions should not appear.
Select and verify a style
Choose a base style, save it, and verify scrolling and keyboard behavior.
The base plugin includes 14 selectable styles. Choose the style that fits the page, save the settings, and test from the top through the final tracked section. Also verify the Alt/Option + Up and Down section-navigation shortcuts without taking focus away from an active form control.