In this article:

  1. Introduction

  2. Editing file config > settings_schema.json

  3. Editing file config > settings_data.json

  4. Editing file snippets > slider.liquid

  5. Adjust slider size

⚠️ Kindly take note :

  • The recommended size for desktop slider is 1400 x 700px

  • 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. Introduction

This is a guide for you to have more sliders for online store. No coding knowledge needed. Simply follow the steps below to add more sliders.

Benefits:

  • Able to highlight more products

  • Able to provide more information

  • Increase sales

2. Editing file config > settings_schema.json

2.1 Go to EasyStore Admin > Channels > Online Store > Edit Source > config > settings_schema.json ( last file in the left sidebar )

2.2 Look for <"label": "Social media"> ( around row 740 - 745 ) and find the square bracket < ] > before it.

2.3  Add <   , "number" : 10   > behind the square bracket. This will increase your number of sliders to 10.

2.4 Click 'Save' button on the top right.


3. Editing file config > settings_data.json

3.1 Go to config > settings_data.json.

3.2 Find <"slide_4_alt": "",>.

3.3 Paste codes below after it.

"slide_(number)": "",
"slide_(number)_jpg": "",
"slide_(number)_link": "",
"slide_(number)_alt": "",

Note: Change the (number) to 5,6,7,8,9,10 as shown below.

3.4 Click the 'Save' button once again.


4. Editing file snippets > slider.liquid

4.1 Navigate to snippets > slider.liquid

4.2 Change the number <4> to <10> as shown below.

4.3 Click the 'Save'.

4.4 Now you can upload up to 10 sliders.

5. Adjust slider size

Step 1 : Click into Channels > Online Store > Edit Source > theme.scss

Step 2 : Add this code at the bottom of theme.scss file & you can change the max-width according to your preferences

💡 Tips : 1000px is full width

.flexslider {
max-width: 1000px;
margin: 0 auto;
}

Step 3 : Save

Related Articles:
Changing Slider Image
Add Content in Between Sliders and Featured Products
Recommended image size to upload

Did this answer your question?