Infinite Scrolling and Load More – built in UB Trex Pro theme by default

We’re happy to share with you Infinite Scrolling which forms a part of the core features in our upcoming Magento 2 theme -- UB Trex Pro.

Infinite Scrolling means is exactly what the term describes -- a function that allows shoppers to load product continuously, eliminating the need for pagination. So instead of having to click a link to get to the next set of products, infinite scrolling pulls the next products automatically into view when the shopper approaches the bottom of the page.

Check out the highlights and key features below to learn about this useful feature.

Infinite Scrolling with 3 flexible options

Typically, this feature is implemented with Ajax, which asynchronously loads fresh content, triggered by the user scrolling beyond a page point. It supports the following options:

  • Infinite scrolling
  • Infinite scrolling with page limit
  • Load More button

Magento 2 Infinite Scrolling

Infinite Scrolling -- Built in UB Trex Pro theme


You’ve likely seen either Infinite Scrolling or Load More button options in use all over the web.

There are several cases where there are cons against infinite scrolling: if it is not implemented well, the shoppers can lose their place after a while. This is where the ‘Infinite scrolling with page limit’ option comes in handy -- it combines Infinite Scrolling and the Load More button. When this page number is reached, a button to load more products will be shown instead of continue loading products automatically with the scroll.

Apply Infinite Scrolling to Category Page, Search Page or Product List Widget

By default, you can use the Infinite Scrolling with UB Trex Pro theme for the following pages or widget:

  • Category page
  • Search page
  • Catalog product list widget

Magento 2 Infinite Scrolling

Easy to set up Infinite Scrolling your way

Infinite Scrolling is a common feature for Magento category page. Keep scrolling, the category page keeps expanding.

For the search page, it is really useful where your shoppers will want to continue viewing new search results while they don’t find the one they want, and a pagination option can slow down in their search.

Besides, if you use the Catalog Product List widget to display the list of products and assign them to appear in a specific place in the page layout, infinite scrolling can also be applied to this dynamic widget. Note that, in order to enable Infinite Scrolling for the Product List widget, you need to enable the Display Page Control within the widget first.

Custom Load More button, Ajax Loader and more

You have full control over setting up for infinite scrolling in UB Trex Pro theme. It’s easy to specify your own Load More button text, Ajax Loader icon etc., If you need to add page parameter to URLs, such as https://yourdomain.com/men.html?p=2, simply enable that option right within the admin dashboard.

Magento 2 Infinite Scrolling

Easy to set up Infinite Scrolling

Conclusion

You’ve learned the highlights of Infinite Scrolling feature which will be built in by default in (Magento 2) UB Trex Pro theme.

In many cases, if pagination is not an option for loading your product data, you can take advantage of Infinite Scrolling. This way, it automatically adds the next page, saving users from a full page load.

If you need to find out more about our upcoming UB Trex Pro theme, head over to the theme’s sneak peek here.

In the meantime, if you have any questions or comments, please let us know in the comment section below.

Written By

Head of UberTheme Team

Comments