On a one-page site, the Scroll Navigation dots or links take visitors to each section. Smooth Navigation makes those jumps use the same feel as the rest of your page scrolling.
It connects the free Smooth Scroll block with the Scroll Navigation block in Nexter Blocks Pro.
For every Smooth Scroll setting in one place, see the Smooth Scroll block guide.
Before You Start
- Edition: Smooth Scroll is Free; the Scroll Navigation block needs Nexter Blocks Pro.
- Block to enable: Smooth Scroll, switched on under Nexter > Blocks in your WordPress dashboard.
- A one-page layout: sections with IDs and a Scroll Navigation block pointing at them. See how to create one-page scroll navigation.
Steps
- Build your sections and add the Scroll Navigation block with one item per section.
- Add the Smooth Scroll block to the same page.
- In the Smooth Scroll block, open Connections and turn on Smooth Navigation.
- Open Scrolling Core, click Advanced and choose an Easing. Adjust Duration under Simple if needed. Save.
How It Behaves
- Scroll Navigation already moves to a section with its own animation.
- With Smooth Navigation on, that movement is handled by Smooth Scroll instead, so it follows your Duration and Easing.
- With it off, the navigation keeps its own animation, while mouse-wheel scrolling still uses Smooth Scroll.
- Ordinary links to page sections, outside the Scroll Navigation block, are not changed.
Limitations
- Both blocks must be on the same page.
- Smooth Navigation only affects the Scroll Navigation block, which requires Nexter Blocks Pro.
Troubleshooting
Clicking a navigation item looks the same as before
Check that Smooth Navigation is on and try a different Easing, such as Linear, to see the change clearly.
