Catalog Infinite Scroll

Seamless AJAX infinite scroll & load-more for Magento 2.
Auto-loads the next page of products as shoppers reach the bottom — on category, search, Page Builder, CMS and widget lists — with optional masonry, isotope and packery layouts. Configured entirely from the admin, tuned to protect Core Web Vitals, and self-hosted with zero third-party CDN calls.

Replace clunky numbered pagination with a continuous, app-like browsing experience. Shoppers keep scrolling and products keep loading — no clicks, no full page reloads — which keeps them in the catalogue longer. On narrow screens it switches to a tidy View More button instead of hijacking the scroll.

Why

Most infinite-scroll extensions bolt onto the category page and stop there, pull their JavaScript from public CDNs, and quietly hurt your Largest Contentful Paint by hiding the grid until a layout library boots.

This one is built the opposite way:

• It works on any list, not just the category grid — a widget drops it onto Page Builder blocks, CMS pages and static blocks, and it can drive several lists on one page.
• It protects LCP. The default mode never hides your products, and the masonry / isotope / packery libraries only download when you actually choose one of them.
• It calls nothing external. Every library is self-hosted in the module, so there's no third-party request, no CSP headache and nothing to break when a CDN does.

Install

Requires Magento Open Source / Adobe Commerce 2.4.7–2.4.9 on PHP 8.2–8.4.

Configure

Stores → Configuration → CoullWorks → Catalog Infinite Scroll. Enable it and the module attaches to your category and search result pages automatically. Every option is per store view.

Layout modes

Default keeps your theme's native grid — nothing extra loads. Choose Masonry, Isotope or Packery and the matching library is fetched only then, and the grid fades in once images are measured so items don't jump. The default mode never hides content, so it has no effect on LCP.

Use it on any list (Page Builder, CMS, static blocks)

Add the "Infinite Scroll (CoullWorks)" widget wherever you can insert content:

• Page Builder — add an Insert Widget content type to any row/column.
• CMS pages & static blocks — Insert Widget in the editor, or the {{widget}} directive.
• Layout XML — a <widget> / <block> instruction.

Point it at the list's Container Selector, Item Selector and Next Button Selector, pick a layout mode, and it runs — no code. Because Magento initialises the component per matched element, one page can host several independent infinite lists.

AJAX layered navigation: if a filter replaces the product list without a full page reload, the module detects the swap and re-initialises on the new list automatically — no theme wiring or extension-specific hooks required.

Performance & Core Web Vitals

• No render-blocking and no CDN. Only jquery, uiComponent and mage/template (already on the page) load up front; the scroll library loads asynchronously after render.
• Pay only for what you use. Masonry/Isotope/Packery are lazy-required per mode.
• LCP-safe reveal. The grid-hiding reveal is scoped to layout modes only.
• Analytics-aware. Appends fire a GA4 virtual pageview so infinite scroll doesn't blank your page metrics.

How it works

• A small uiComponent (view/frontend/web/js/scroll.js) is initialised once per matched container by text/x-magento-init, so the same code drives the auto-attach and every widget.
• A single PHP block (Block/Scroll.php) builds the init payload, preferring widget parameters over store config — one source of truth, reused everywhere.
• The frontend stack is Infinite Scroll, with Masonry / Isotope / Packery, all self-hosted under view/frontend/web/js/vendor/.

Compatibility

Development

CI (GitHub Actions) runs PHP lint across 8.2/8.3/8.4, the Magento 2 coding standard, composer validate and ESLint on every push and PR.

Roadmap

• CoullWorks Infinite Scroll SDK — a dependency-free (MIT) infinite-scroll library, raw TS/JS plus a React wrapper, to replace the Metafizzy stack and make this module MIT end to end.
• CoullWorks Core — a shared base module (branding, helpers, config plumbing) reused across all CoullWorks Magento plugins.

Third-party licenses

The bundled browser libraries keep their own licenses; Infinite Scroll, Isotope and Packery are GPLv3 / commercial. Details and the commercial-licensing note are in THIRD-PARTY-LICENSES.md.

Support

Free and open source. If it saves you time, you can support the work:

or PayPal — [email protected]

Questions and bugs: open an issue.

License

MIT © CoullWorks

⚓ Powered by CoullWorks
_{Built in the open by CoullWorks — web & software engineering. coullworks.com}