YITH Infinite Scrolling lets you show the content of different pages in one single page: with the related settings, the paging will be canceled and contents will be loaded in the same page with an infinite scrolling effect.
Products are loaded in Ajax and the plugin works on blog and shop pages.
The Premium Version allows you to enable Infinite Scrolling on as many sections as you want!
You can enable the plugin under YITH Plugins -> Infinite Scrolling.
By enabling this setting, your customers will also be able to enjoy the benefits of infinite scrolling on your Ecommerce, on their mobile devices.
By enabling this option, you can change the page URL dynamically based on the page that is loaded.
The result is that if your users open a post or a product and then go back to the main page with the infinite scrolling, they will be able to resume from where they left, instead of having to scroll down everything again.
It remembers the position when you hit the back button.
The premium version of the YITH Infinite Scrolling lets you have a scroll effect on different pages of your site, allowing you to customize these settings separately.
The first step is to create and name a section in which you want to have the Infinite Scrolling effect. In this example, we will call it “shop”.
Now you will have the following options available to customize the created section, the options are Navigation Selector, Next Selector, Item Selector and Content Selector.
Navigation selector: The selector that contains the product navigation
Next selector: The selector of the link that redirects to the next page
Item selector: The selector of the single product in the shop page
Content selector: The selector of the general box in the product list of the shop
Afterward, you can choose an event type, this is the type of pagination for the content of the indicated selection. You can choose between:
Infinite scrolling: the contents of the next page are loaded scrolling the current page. Load more button: the contents of the next page are loaded in Ajax clicking on the “Load more” button. Ajax pagination: an Ajax pagination is added in the lower part of the current page.
If you choose “Infinite Scrolling” as “Event Type”, you will be able to choose between four types of available loaders. This option allows you to choose the loader you want to show your customers while they are scrolling and waiting for your products to load. Or if you prefer, choose a custom loader that will override the previous one.
The last option is to set the loading effect, you can choose between the following options for the type of animation for the loading of new content.
On the bottom of the General Settings page, you can add your custom JavaScript code. You can use two plugin triggers: yith_infs_adding_elem is triggered before the new elements are appended to the current content, and yith_infs_added_elem is triggered after the AJAX call ends.
