Discuss and resolve questions on Liquid, JavaScript, themes, sales channels, and site speed enhancements.
add product grid section from collection page to homepage on refresh theme. I need to add the full section with filter and all to my homepage. i tried to add a new section with same code from gird section and it was not showing in the dashboard.
This is Amelia from PageFly - Landing Page Builder App
To add a product grid section from the collection page to your homepage in the Refresh theme, including filters, follow these steps:
Create a New Section:
Add Code to the New Section:
{% schema %} { "name": "Home Collection Product Grid", "settings": [ { "type": "collection", "id": "collection", "label": "Collection" }, { "type": "number", "id": "products_per_page", "label": "Products per page", "default": 12 } ], "presets": [ { "name": "Home Collection Product Grid" } ] } {% endschema %} <div class="section"> <div class="grid"> {% paginate collection.products by section.settings.products_per_page %} {% for product in collection.products %} {% include 'product-grid-item', product: product %} {% endfor %} {% endpaginate %} </div> </div>
Include Filters:
Add the Section to the Homepage:
Test and Adjust:
Hope that my solution works for you.
Best regards,
Amelia | PageFly
Please let me know if it works by giving it a Like or marking it as a solution!
➜ Optimize your Shopify store with PageFly Page Builder (Free plan available)
➜ Weekly updated Shopify tutorials on YouTube
All features are available from Free plan. Live Chat Support is available 24/7.
2m ago Learn the essential skills to navigate the Shopify admin with confidence. T...
By Shopify Feb 12, 2025Learn how to expand your operations internationally with Shopify Academy’s learning path...
By Shopify Feb 4, 2025Hey Community, happy February! Looking back to January, we kicked off the year with 8....
By JasonH Feb 3, 2025