Spotlight Block

Enable Custom Position TitleStyle 1

Style 2

To add this section, please follow below steps:

1. From your Shopify admin, go to Online Store -> Themes.

2. Find the theme that you want to edit, and then click Customize.

3. Click Add section and choose "Spotlight Block".

Section settings

General

Settings	Meaning
Section Width	Select the layout width of the whole section. The options are: Default (same as the body width), 1170px, 1770px, Full Width (the 100% of the viewport width).
Padding Container Full Width	Determine the left and right spacing of the Full Width layout.
Disable Padding Content?	Toggle Padding for the Content
Margin Minus Top	Determine the section negative spacing from the top.
Layout	Select the layout of the block item to be in a Grid or Slider.
Layout Mobile Responsive	Select the layout for the section render on mobile device. The options are: List, Scroll Snap and Slider.
Column	Select the column count for the grid and slider on destop.
Column Mobile	Select the column count for the grid and slider on mobile.
Show Arrows On Desktop	Toggle the navigation arrows on Desktop.
Show Arrows On Mobile / Tablet	Toggle the navigation arrows on Mobile/Tablet.
Position Vertical Arrow - (Unit % or px)	Enter the position of the arrows relative to the top of the slider.
Show Dots On Desktop	Toggle the paginating dots on Desktop.
Show Dots On Mobile / Tablet	Toggle the paginating dots on Tablet and Mobile.
Enable Border Bottom?	Toggle Border Bottom
Border Color	Apply a color to the border bottom.
Spacing Top / Spacing Bottom on Desktop, Tablet, Mobile	Determine the spacing of the section from its top and bottom sections on Desktop, Tablet and Mobile separately.
Background Color - Background Gradient	Set color (or gradient) for the section background.
Background Image	Upload/Select an image as the section background.
Title	Enter in the title for the section.
Enable Title Border?	Toggle title torder
Enable Custom Position Title	Toggle custom position title
Title Color	Apply a color to the title of the section.
Title Color Mobile	Apply a color to the title of the section on mobile.
Title Font Size	Specify the font size of the title.
Title Font Size Mobile	Specify the font size of the title on mobile.
Title Margin Bottom	Determine the spacing of the title from bottom on Desktop.
Description	Enter the text for the description.
Description Color	Apply a color to the description.
Description Margin Bottom	Determine the spacing of the description from bottom.
Description Font Size	Specify the font size of the description on desktop.
Alignment	Select the alignment of the header text to be either to the Left, Center or to the Right of the section.
Grid Gap	Determine the gap between items.
Border Radius	Determine the roundness of the items.
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	Select the alignment of the View all text to be either to the Left, Center or to the Right.
View All Font Weight	Select the font weight of the 'View all' text.
View All Margin Bottom	Determine the top spacing of the "View all" Desktop.
Toggle "View all" border?	Toggle view all border?
View All Link	Set URL for the "View all" to redirect to if the "Redirect To URL" is selected.
View All Color	Apply a color to the "View all" of the block.
Display Button?	Toggle the button display at the bottom.
Button Text	Enter the text for the button.
Button Link	Enter URL for the button to redirect to.
Color - Border Color - Background Color - Background Gradient - Hover / Active Color - Hover / Active Border Color - Hover / Active Background Color - Hover / Active Background Gradient	Set the text color, background and border color for both the normal and hover states of the button.
Button Width	Determine the width of the button.
Button Spacing Top	Determine the spacing of the buttons from top.

Box Shadow For Block Item

Settings	Meaning
Enable Box Shadow ?	Toggle Box Shadow
Horizontal Length	Determine the offset of the box shadow to the right.
Vertical Length	Determine the offset of the box shadow to the left.
Blur Radius	Determine the how blur the box shadow is.
Spread	Determine the far the thickness of the box shadow maintains.
Background Box Shadow	Set background color for the box shadow
Inset?	Toggle to set the box shadow falls inward or outward.
Enable Plus Icon?	Toggle the plus icon for block item
Enable Border Content	Toggle the border for the content.

Block settings

[BLOCK] Small Image

Settings	Meaning
Enable Image?	Toggle image to show.
Image	Upload/Select image for the banner.
Alignment	Select the horizontal alignment of the text content to be either to the Left, Right or Center.
Content on Image	Toggle the content inside the image.
Content Align Items	Select the vertical alignment of the text content to be either to the Top, Bottom or Center.
Content Position Top/Bottom	Determine the top and bottom spacing of the text content relative to the image's top/bottom based on the alignment on desktop
Content Position Top/Bottom Mobile	Determine the top and bottom spacing of the text content relative to the image's top/bottom based on the alignment on mobile
Background Color	Background Color
Content Spacing Top	Determine the spacing of the content from top.
Content Spacing Bottom	Determine the spacing of the content from bottom.
Content Spacing Left/Spacing Right	Determine the spacing of the content from left/right (cannot be used when 'Enable Border Content' is enabled in the settings section).
Sub Title	Enter in the sub title for the content item.
Enable Border Sub Title	Toggle border sub title
Sub Title Color	Apply a color to the sub title of the content item.
Sub Title Font Size	Specify the font size of the sub title.
Font Weight	Select the font weight of the sub title
Sub Title Spacing Bottom	Determine the spacing of the sub title from bottom.
Title	Enter in the title for the section.
Title Color	Apply a color to the title of the content item.
Title Font Size	Specify the font size of the title.
Title Font Size Mobile	Specify the font size of the title on mobile.
Font Weight	Select the font weight of the title
Enable Font Weight Italic?	Toggle font weight italic of the title
Title Border	Select border/underline style of title: None Style 1: full-width border Style 2: full-width and full-height border Style 3: short border, centered Style 4: border display on hover
Title Border Color	Apply a border color to the title.
Description	Enter the text for the description.
Description Color	Apply a color to the description.
Description Font Size	Specify the font size of the description.
Enable Description Hover?	Toggle description on hover
Button Style	Select the style of the button: Style 1 : normal button. Style 2 : as a Link
Button	Enter the text for the button.
Link	Enter URL for the button to redirect to.
Button Font Size	Determine the font size of the button.
Determine the font size of the button.	Determine the width of the button.
Color - Border Color - Background Color - Background Gradient - Hover / Active Color - Hover / Active Border Color - Hover / Active Background Color - Hover / Active Background Gradient	Set the text color, background and border color for both the normal and hover states of the button.
Button Background Opacity	Specify the transparency of the button background.
Enable Custom Border?	Toggle custom border?
Button Text Transform	Transform the text of the button to be either normal, uppercase, lowercase or capitalize.
Icon	Enter the SVG icon for the button.
Button Spacing Top	Determine the spacing of the buttons from top.

[BLOCK] Large Image

Settings	Meaning
Enable Image?	Toggle image to show.
Image	Upload/Select image for the banner.
Alignment	Select the horizontal alignment of the text content to be either to the Left, Right or Center.
Content on Image	Toggle the content inside the image.
Content Align Items	Select the vertical alignment of the text content to be either to the Top, Bottom or Center.
Sub Title	Enter in the sub title for the content item.
Enable Border Sub Title	Toggle border sub title
Sub Title Color	Apply a color to the sub title of the content item.
Title	Enter in the title for the section.
Title Color	Apply a color to the title of the content item.
Title Border	Select border/underline style of title: None Style 1: full-width border Style 2: full-width and full-height border Style 3: short border, centered Style 4: border display on hover
Title Font Size	Specify the font size of the title.
Title Font Size Mobile	Specify the font size of the title on mobile.
Font Weight	Select the font weight of the title
Enable Font Weight Italic?	Toggle font weight italic of the title
Description	Enter the text for the description.
Description Color	Apply a color to the description.
Description Font Size	Specify the font size of the description.
Description Spacing Top	Determine the spacing of the description from top.
Button	Enter the text for the button.
Link	Enter URL for the button to redirect to.
Button Font Size	Determine the font size of the button.
Color - Border Color - Background Color - Background Gradient - Hover / Active Color - Hover / Active Border Color - Hover / Active Background Color - Hover / Active Background Gradient	Set the text color, background and border color for both the normal and hover states of the button.
Button Background Opacity	Specify the transparency of the button background.
Button Text Transform	Transform the text of the button to be either normal, uppercase, lowercase or capitalize.
Icon	Enter the SVG icon for the button.
Button Spacing Top	Determine the spacing of the buttons from top.

Animation

Settings	Meaning
Image Behavior	Select animation for images