For more details see how Infinite Scroll for Magento 2 extension works.
Infinite scroll for Magento 2 automatically loads product catalog without reloading the page. Your customers will be pleasantly surprised with supportive navigation and high performance of your web store.
The extension offers you an enjoyable navigation and new opportunities in the presentation of goods. With this extension, the catalog browsing may become a smooth surfing experience. The module significantly saves time and nerves to your customers and consequently to yourself.
To get the access to the “Infinite Scroll” settings please go to: Stores → Configuration → Amasty Extensions → Infinite Scroll
Loading Type - choose from the available loading styles.
See the full list and each type specifics below:
Number of Automatically Loaded Pages - Enter the number of pages a user needs to scroll before 'Auto mode' applies. This setting is only available for Combined loading types: Combined - automatic + button and Combined - button + automatic.
Let's say, you set the number of automatically loaded pages as 4.
In the case of the Combined - automatic + button scenario, a user will see the first 4 pages similarly to a long one-pager. Then, to load the 5th, 6th, 7th, etc. pages, the user will need to press a 'Load More' button every time to load the page.
However, with the Combined - button + automatic user will be asked to press a 'Load More' button only once - between the 4th and 5th page.
Display Page Numbers - Choose 'Yes' to display the pages separator with numbers. While scrolling down the list of products you will see the line separator with the page number. Select 'No' to deactivate the separator and have the plain catalog list.
Page Numbers Style - Choose the style of page numbers from the list.
AJAX Progress Image Path - Insert the path to your own loading theme to customize your website. Choose what kind of loading wheels fits your web store layout.
With the Infinite Scroll extension, you can customize buttons to your taste.
Label for the Prev Button - Specify text for the button that leads to the previous page.
Label for the Next Button - Specify text for the button that leads to the next page.
Button Color - Use the integrated color picker to choose the color of the Prev-Next button.
Button Color (Pressed) - Use the integrated color picker to choose the color of the Prev-Next button when it's pressed.
Enabled - Enable/disable the Back to Top Button that provides shoppers with the opportunity to quickly get back to the top of the page, if enabled. Choose Yes to display info bar with current page number and total pages count
Button Style for Desktop - Choose the style for your Back to Top button display on a desktop from the list.
Button Style for Mobile - Choose the style for your Back to Top button display on mobiles from the list.
The following styles are available:
Button color - Use the integrated color picker to choose the color of the Back to Top button.
Products Group / Product Link / Footer - In this section you can specify CSS classes of blocks after which the module should load products, toolbars and pager. This is sometimes needed when standard classes are removed from custom design themes.