In this article:
Increase featured collections to 6
Make arrangement in mobile version to 2 featured collections per row
Add 'Featured Products' title for Fall theme
Full-width for featured collection

⚠️ 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
We have added an option for you to display image with original quality. Therefore, your store will be using the image with original size and format.
You can enabled it at Channels > Online Store > Customize > General



1. Increase featured collections to 6

Step 1 : Go to EasyStore Admin > Online Store > Themes > Edit source > folder config/settings_schema.json.



Step 2 : Find < Featured collections > at around line 1171 > scroll down to collection 4 > copy the highlighted (grey) section as below.



Step 3 : Paste it below and change the number to 5. Result as below.



Step 4 : Repeat step 3 above for number 6 > Save.

Step 5 : Then, go to folder config/settings_data.json > copy the highlighted (grey) section as below.



Step 6 : Paste it below and change the number to 5. Result as below.



Step 7 : Repeat step 6 above and change the number to 6 > Save.

Step 8 : Now you can go to Themes > Customize > Featured collections and you will be able to see Collection 5 and 6.



2. Make arrangement in mobile version to 2 featured collections per row

Step 1 : Go to Edit source > folder assets/theme.scss.

Step 2 : Find the highlighted (grey) section below.



Step 3 : Replace the section with the code below.

flex-basis: auto;width: calc(50% - 10px);


Step 4 : Result as below.



Step 5 : Save and done



3. Add 'Featured Products' title for Fall theme

Step 1 : Go to Edit source > folder featured-product.liquid

Step 2 : Search for featured-product-wrapper > then add below with
<h2 class="section-header__title text-center">Featured products</h2>


You can change the highlighted words according to your preferences



Step 3 : Save and you're done.

Result:



4. Full-width for featured collection

Step 1 : Click on Channels > Online Store > Edit Source and select theme.scss file

Step 2 : Look for .highlight-section{ around line 3530 and remove max-width: $siteWidth;



Step 3 : Save and here's the result

Before:



After (full width):

Was this article helpful?
Cancel
Thank you!