Slideshow
Last updated
Last updated
To add this section, please follow below steps:
From your Shopify admin, go to Online Store -> Themes.
Find the theme that you want to edit, and then click Customize.
Click Add section and choose "Slideshow".
In Theme Editor of Slideshow -> Scroll down to "BLOCK CATEGORIES" -> Select Menu Category to show categories for this block.
You need to create a menu in Navigation first
To show icons for categories, please follow below instruction to upload icons:
Prepare your Icon image with the same name as the menu name (please use PNG image format).
Rules: Lower cap and use a hyphen "-" to replace white space if your color image name has the white space. For example: with the menu name "Pellentes Habitanto", the image name will be pellentes-habitanto.png
Recommended size for icon image: 24 x 24px
Go to Settings --> Files, upload images here:
| Setting | Description |
|---|---|
Layout | Select the width layout of the section to be either default to the body's width, 1170px, 1770px or full screen width. |
Padding Container Full Width | Determine the spacing of the left and right sides if the layout 'fullwidth' is selected. |
Spacing top - Desktop / Tablet / Mobile | Determine the spacing of the section from the top on Desktop, Tablet and Mobile. |
Spacing bottom - Desktop / Tablet / Mobile | Determine the spacing of the section from the bottom on Desktop, Tablet and Mobile. |
Background Color | Set the background of the slideshow. |
Background Gradient | Set the background gradient of the slideshow. |
Background Image | Upload / Choose an image as the background for the slideshow. |
| Setting | Description |
|---|---|
Slideshow Auto Play | Enable the autoplay feature on slideshow. |
Change slides every | Select the interval to switch to the next slide. |
Slideshow transition effect | Select the transition effect to be either fade or slide. |
Dots Direction | Select the position and direction of slideshow pagination dots on Desktop. Default: The dots are horizontal and centered. Left: The dots are vertical and to the left. Right: The dots are vertical and to the right. |
Enable Custom Arrow? | Enable to allow the custom arrow width, height and size. |
Width Arrows | Determine the width of the arrow (for custom arrow) |
Height Arrows | Determine the height of the arrow (for custom arrow) |
Size Icon Arrows | Determine the size of the arrow icon (for custom arrow) |
Color - Background - Border Color | Set the color, background and border for both normal and hover/active states of slideshow arrows. |
| Setting | Description |
|---|---|
Slideshow Video Height | Fill in the video height in percentage relative to the height of the slideshow. |
Autoplay video | Enable the video to auto play. |
| Setting | Description |
|---|---|
Enable Categories? | Enable to show the categories. |
Title | Enter the title for the categories. |
Title Color | Set the color of the title. |
Title Background Color | Set the background for title. |
Text Color | Set color for the text. |
