Change slider image

In this article:

Introduction
Uploading / changing slider image
Adjust slider size

⚠️ Kindly take note :

The recommended size for desktop slider is 1400 x 700px
Below 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 > Themes > Customize > General

1. Introduction

Use the sliding banner to display images of your brand or latest promotions. Insert the links to redirect your visitors to the related page.
Users love stunning imagery, and this save up the time scroll down through a gallery.
SEO – When a user stays on your site longer (by viewing all the slideshow), this indicates to search engines that the site is engaging. Therefore, a slider may help boost your SEO.
Call to Action (CTA) – A Slider provides multiple CTA above the fold (meaning the user doesn’t have to scroll down to see it).

2. Uploading / changing slider image

Step 1 : EasyStore Admin > Channels > Online Store > Themes > Customize > Slider Content



Step 2 : You can amend the options below at Slider Settings (New Themes) according to your preference (optional).



Step 3 : Hover your mouse over the image and click to upload or change your slider image.



Step 4 : Insert Link and Alt text (optional).

Link - customers will be brought to this page by clicking on the slider image

Alt text (Old Themes) - alternative text is a word or phrase that can be inserted as an attribute in an HTML (Hypertext Markup Language) document to tell Web site viewers the nature or contents of an image. In case the image is not showing up, the text will be shown.



Step 5 : Continue with the remaining slides.

Step 6 : Save and you're all done!

💡 Tips: The following themes will show full page width sliders

Mine Style

Happy Kitchen

Fall

3. Adjust slider size (For Candy, WAVE, LUCKY, X-Force, Mine Style, dREAMS Bedding, The Summer, Advanture Camping, Happy Kitchen, and Flower & Tea House only)

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

Updated on: 09/10/2023