Slidable Spotlight
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 "Slidable spotlight".
Section width
Choose the maximum width of the section on the Desktop. The options are:
Default (width of the body content set in the Theme settings)
Width (1170px)
Width (1770px)
Full width (the width of the browser).
Note: To fit more videos in a row, a wider layout is more appropriate
Padding for 'full width' option on desktop
Determine the left and right spacing of the Full Width layout.
Background color
Set color for the section background.
Background gradient
Set color gradient for the section background.
Background image
Upload/Select an image as the section background
Title
Enter in the title for the section.
Title color
Apply a color to the title of the section.
Title font size
Determine the font size of the title on Desktop.
Title font size on mobile
Determine the font size of the title on Mobile.
Title font weight
Select the font weight of the title
Title bottom margin
Determine the spacing of the title from bottom on Desktop.
Title bottom margin on mobile
Determine the spacing of the title from bottom on Mobile.
Horizontal position (unit % or px)
Fill in the desired positions of arrows horizontally relative to their slider.
Desktop
Determines the height of the top inner space of the section on the desktop device. Can be from 0px to 100px, increasing arithmetically of 5px (pixel).
Tablet
Determines the height of the top inner space of the section on the tablet device. Can be from 0px to 100px, increasing arithmetically of 5px (pixel).
Mobile
Determines the height of the top inner space of the section on the mobile device. Can be from 0px to 100px, increasing arithmetically of 5px (pixel).
Desktop
Determines the height of the bottom inner space of the section on the desktop device. Can be from 0px to 100px, increasing arithmetically of 5px (pixel).
Tablet
Determines the height of the bottom inner space of the section on the tablet device. Can be from 0px to 100px, increasing arithmetically of 5px (pixel).
Mobile
Determines the height of the bottom inner space of the section on the mobile device. Can be from 0px to 100px, increasing arithmetically of 5px (pixel).
Image
Upload/Select an image.
Link
Set link for the block image to redirect to when clicked if the When Click On Image "Redirect To URL" option is selected.
Title
Enter in the title for the block.
Color
Apply a color to the title of the block.
Title font size
Determine the font size of the title on Desktop.
Title font size on mobile
Determine the font size of the title on Mobile.
Title font weight
Select the font weight of the title
Button label
Enter the text for the button.
Button label color, Button border color, Button background color, Button background gradient, Button label hover color, Button border hover color, Button background hover color, Button background hover gradient
Set the text color, background and border color for both the normal and hover states of the buttons.
Button width
Determine the width of the button.
Button top margin
Determine the spacing of the button from top.