How To Show A Product Collection With The Infinite Scroll On Home Page In Shopify
I’ve written an article to guide you on how to add infinite scroll pagination to Shopify collection pages. This way only works on collection pages. If you want to show a product collection with the infinite scroll on the home page, this article is for you.
To do that, you can use a Shopify app. It’s called Hura Collection Embedder.
Hura Collection Embedder is a free Shopify app that helps you display products (from a collection) in a grid view or list view on your store. It is designed for simplicity. You can add the products anywhere on-site, whether it’s a product details page, blog post, index page, or a separate dedicated page for products grid. Thanks to its responsive design, it runs smoothly on mobile phones and tablets.
Follow the below steps to know how to embed a products collection layout with the infinite scroll on the home page.
Firstly, you must install this app if you haven’t already. You can search for Hura Collection Embedder from Shopify App Store.
After successful installation, you go to the app dashboard and select a collection from the list, customize the required parameters, and click the GET CODE button to generate embed code.
The app will give to you an HTML code. So you must add a Custom HTML section on your Shopify home page and paste this embed code for this section and you are done.
The themes usually have this section available, but if your theme is not available then you can follow the article here to know how to add a “Custom HTML” section to your Shopify store manually.