Add more featured products sections

📌Kindly take note :

Above all code editing, you will need to re-edit the code again if you switch to a new theme template
We do not allow to change or edit the code for the checkout page (which include shipping & payment method) due to security reasons

1. Increase featured products sections

Step 1 : Go to EasyStore Admin > Online Store > Themes > Edit source > folder templates > home.liquid

Step 2 : Copy the code section below > paste it after the {% endif %} under the section that you wish to add the featured product sections

<link rel="stylesheet" href="https://s3.ap-southeast-1.amazonaws.com/eesb.public/cdn/swiper-bundle.min.css"> 
<style>
 .swiper-slide .product_grid-item{ width: 100%; float: none; padding: 0; } 
.swiper-slide:not(.swiper-container-initialized) .product_grid-item img.lozad:not(.loaded){ padding-top: 0;height: 0; } 
.swiper-button-next, .swiper-button-prev{ color: #333; } 
.swiper-button-next.swiper-button-disabled, .swiper-button-prev.swiper-button-disabled{ pointer-events: auto; } @media screen and (max-width:600px){ 
.swiper-button-next, .swiper-button-prev{ display: none; } 
} 
</style> 
<div class="wrapper featured-product-wrapper"> 
<h2 class="text-center"> ##Title here## </h2>
 <div {% if settings.product_img_crop == "img-equal-height" %}data-equal-height="1"{% endif %} class="swiper-container swiper-js-wrapper"> 
{% assign collection_data = all_collections['collection-handle'].products %} 
<div class="swiper-wrapper"> 
{% for product in collection_data %} 
<div class="swiper-slide"> 
{% include 'product-grid-item' %} 
</div> 
{% endfor %} 
</div> 
<div class="swiper-button-prev"></div>
<div class="swiper-button-next"></div> 
<div class="swiper-pagination"></div>
 </div> </div> 
<script src="https://s3-ap-southeast-1.amazonaws.com/eesb.public/cdn/swiper-bundle.min.js"></script> 
<script> $( document ).ready(function() { var swiper = new Swiper('.swiper-js-wrapper', { slidesPerView: 4, spaceBetween: 30, navigation: { nextEl: '.swiper-button-next', prevEl: '.swiper-button-prev', }, pagination: { el: '.swiper-pagination', clickable: true, dynamicBullets: true, }, breakpoints: { 320: { slidesPerView: 2, spaceBetween: 20 }, 480: { slidesPerView: 3, spaceBetween: 30 }, 640: { slidesPerView: 4, spaceBetween: 40 } } }); }); </script>

Step 3 : Replace the text ##Title here## with your preferred title > Save

Result:

Step 4 : Add and assign your featured product into a collection. Refer here

Step 5 : Replace the text `collection-handle` with the handle of the collection that you wish to link with

💡Tips: You may find the handle of the collection under product > collection > scroll down to Search engine optimization > copy the text after `collections/`