How to find these settings...
- Online Store
- Customize (Theme Editor)
- Add section
- Slideshow with image
The most versatile section in the theme. Though it is called a 'Slideshow', this section can be used with a single content block as a standard promotional section. If you need a to add text to your slideshow, see Slideshow with Text.
In this section...
Options
Auto-rotate slides
Check to turn on the auto-rotation
Change slides every
You have the option to control the speed that the slides will auto rotate from 4-10 seconds
Full width
The slide has the option of being as wide as the screen or only as wide as the content container. Refer to the following table to reference content widths & optimal image sizing:
Setting
Desktop Width
Minimum Image Width
Full width checked
100%
1900px
Full width unchecked
1180px
1180px
Enable multi slide navigation
Add next and previous arrow buttons
Slide navigation color
Choose a custom color for the slider navigation arrows
Section
Lazy load images *
Enable for "above the fold" images. Disable for any image that is not visible on the initial page load
Background color
Choose a custom color for the background
Background gradient
Choose a custom gradient for the background
MOBILE
Top padding
Add padding to the top of the section on screens less than 768px wide. Padding is applied to the inside of the container. 0px is the minimum, and it steps up by 10 to a maximum of 60px
Bottom padding
Add padding to the bottom of the section on screens less than 768px wide. Padding is applied to the inside of the container. 0px is the minimum, and it steps up by 10 to a maximum of 60px
Bottom margin
Add a margin to the bottom of the section on screens less than 768px wide. Margins are applied to the outside of the container. 0px is the minimum, and it steps up by 10 to a maximum of 60px
DESKTOP
Top padding
Add padding to the top of the section on screens larger than 768px wide. Padding is applied to the inside of the container. 0px is the minimum, and it steps up by 10 to a maximum of 60px
Bottom padding
Add padding to the bottom of the section on screens larger than 768px wide. Padding is applied to the inside of the container. 0px is the minimum, and it steps up by 10 to a maximum of 60px
Bottom margin
Add a margin to the bottom of the section on screens larger than 768px wide. Margins are applied to the outside of the container. 0px is the minimum, and it steps up by 10 to a maximum of 60px
Add a bottom border
A 1px border will be added between the 'Bottom padding' and the 'Bottom margin'
* May not be available in all Sections
Slideshow Content Blocks
Access content blocks using black arrow next 'Slideshow with image'
Link
Include a link with your image
Desktop image
The desktop image will be displayed when the container is greater than 600px wide
Setting
Desktop Width
Minimum Image Width
Full width checked
100%
1900px
Full width unchecked
1180px
1180px
Mobile image
The mobile image will be displayed when the container is 600px wide, so it is recommended to use an image at least 600px wide