Spotlight Block
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 "Spotlight Block".
General
| 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. |
Disable Padding Content? | The max width of the section will be 100% minus the double of padding Container Full Width |
Margin Minus Top | Determine the margin top in negative number (the section will get closer to the section above it) |
Layout | Select the layout for the items to be either Grid or Slider |
Layout Responsive Mobile | Select the layout for the items to be either Grid, Slider or Scroll Snap on Mobile |
Column | Select the number of items to show on a row. |
Column Mobile | Select the number of items to show on a row on Mobile. |
Enable Arrow? | Enable to show the arrow for the slider. |
Enable Border Bottom? | Enable to show the border for the section bottom. |
Border Color | Set the color for the border of the bottom of the section. |
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 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. |
Title | Enter the title for the section. |
Enable Title Border? | Turn on the title border. |
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. |
Title Color | Set the title color for the section. |
Desctiption | Enter the text for the section description. |
Description Color | Set the color for the description text. |
Description Spacing Bottom | Determine the spacing of the description from the bottom. |
Description Font Size | Determine the font size of the description. |
Alignment | Align the content including title and description to the left, the right or center of the section. |
Grid Gap | Determine the gap between each block. |
View all | Enter the text for the view all link |
View All Font Size | Determine the font size of the view all. |
View All Alignment | Align the view all link to the left, the right or center of the section. |
View All Font Weight | Select the font weight for the view all link. |
View All Margin Bottom | Determine the spacing of the view all from the bottom. |
View All Margin Bottom Mobile | Determine the spacing of the view all from the bottom on Mobile. |
Enable View All Border? | Underline the view all link |
View All Link | Specify the URL for the view all to redirect to |
View All Color | Set the color for the view all link |
Display Button | Show the section button. |
Button Text | Fill in the text for the Show More Button for the Grid layout. |
Button Link | Specify the link for the section button to redirect to. |
Color - Border - Background | Set the text color, background and border color for the button. |
Button Width | Determine the width of the button ranging from 50px to 600px. |
Button Spacing Top | Determine the spacing of the button from the top. |
Enable Box Shadow | Toggle to show the button shadow. |
Horizontal Length | Determine how far the shadow falls horizontally from its origin. |
Vertical Length | Determine how far the shadow falls vertically from its origin. |
Blur Radius | Determine how blur the shadow is. |
Spread | Determine how far the shadow keeps its original thickness before getting blur. |
Background Box Shadow | Set the color for the box shadow. |
Inset? | Select Yes to let the shadow falls inward to the button. |
Enable Plus Icon? | Enable to show the plus icon. |
Color Plus Icon | Set the color for the plus icon. |
Last updated
