Lazy loading removes the last click. The visitor scrolls, the next batch arrives, and there is no control to notice or press.
It suits a browsing search where people scan rather than decide — which is most product searches and a good number of content ones.
For every Search Bar setting in one place, see the Search Bar guide.
Before You Start
- Edition: Free. Measured with Nexter Blocks Pro deactivated, the Search Bar renders identically — form, input, dropdowns, suggestions and results all work without Pro.
- Block to enable: Search Bar, switched on under Nexter > Blocks in your WordPress dashboard.
- Published content to find. The block searches your real posts, so a site with nothing published returns nothing.
- More matches than your batch size. Otherwise everything arrives at once and nothing lazy loads.
Steps
- Select your Search Bar block and set the batch size.
- Set the loading behaviour to lazy load.
- Publish and scroll a result list that runs past the first batch.
How It Behaves
Measured: choosing lazy load wrote that behaviour onto the block and rendered no button, which is correct — there is nothing for the visitor to press.
- A spinner marks the boundary. The block renders a loading indicator where the next batch will arrive, rather than a control.
- Batches append to the list. Nothing already on screen is replaced.
- The batch size is separate from the first page size, so the first screen can be larger than the ones that follow.
- It is one of three alternatives. Measured across all three: pagination renders numbered controls, load more renders a button, lazy load renders neither.
- AJAX search has to be switched on for results to appear as you type. With it off the bar behaves as a plain form that submits to WordPress’s own search page.
Limitations
- The footer becomes hard to reach. As long as results keep arriving, the bottom of the page keeps moving. If anything important lives down there, lazy loading is the wrong choice.
- Nothing is in the URL. A visitor cannot link to a point in the list, and the back button will not restore it.
- It keeps requesting while the visitor keeps scrolling, which on a large result set is more server work than pagination.
- There is no sense of scale. Without a total, a visitor has no idea whether they are near the end.
- Only one loading behaviour at a time.
Troubleshooting
Nothing loads as I scroll
AJAX search has to be on. Lazy loading is a fetch, and without AJAX there is nothing to fetch with.
Everything appeared at once
The batch size is larger than the number of matches, so there was nothing left to load.
I cannot reach the footer
That is inherent to lazy loading. Use load more or pagination if the footer matters.
It feels heavy on a big catalogue
Raise the batch size so fewer requests fire, or switch to pagination, which only loads on demand.
