Image Banner
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 "Image Banner".
Section Settings
| 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. |
Title | Enter the title for the section. |
Enable Border Title | Enable to show the line through of the title. |
Title Color | Set the title color for the section. |
Title Font Size | Determine the font size of the section title on Desktop ranging from 10px to 50px. |
Title Font Size Mobile | Determine the font size of the section title on Mobile ranging from 10px to 50px. |
Title Margin Bottom | Determine the spacing of the title from the bottom. |
Description | Fill in the description text for the section. |
Description Color | Set the color for description text. |
Description Font Size | Determine the font size of the description text. |
Alignment | Align content to the left, the right or center of the section. |
SETTINGS BLOCK
| Setting | Description |
|---|---|
Style Background | |
Background Color | Set the Background Color for the whole section. |
Background Gradient | Set the Background Gradient for the whole section. If the gradient is none, then the background color will be applied if any. |
Background Image | Upload/choose an image as the background for the section. |
Enable Arrows | Toggle to show arrows for slider. |
Arrows Position | Fill in the desired positions of the arrow relative to the slider. |
Enable Dots | Toggle to show dots for slider pagination. |
Enable Autoplay | Toggle to let slider autoplay. |
BUTTON
| Setting | Description |
|---|---|
Button Text | Fill in the text for the button |
Link | Set the link for the button to redirect to. |
Button Width | Determine the width for the button the slider. |
Enable Custom Border? | Turn on the custom border underneath the slider button. |
Color - Background Color - Border Color | Set the color, background and border color for both normal and hover states of the button.BL |
Button 2 - Spacing top | Determine the spacing of the button 2 (if any) from the top. |
Last updated
