Featured product
To add this section, please follow the 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 "Featured product".
Product
Select a product to show
Show product badges
Enable/disable checkbox
Enable share
Enable/disable checkbox If you include a link in social media posts, the page’s featured image will be shown as the preview image. Learn more.
A store title and description are included with the preview image. Learn more.
Layout style
Select the layout style for the section:
Special
Classic
Modern
Media
Desktop media size
Select desktop media size from the dropdown menu:
Small
Medium
Large
(Media is automatically optimized for mobile)
Desktop layout
Select desktop layout from the dropdown menu:
Stacked
Carousel
Carousel (Thumbnail)
Image zoom
Select image zoom from the dropdown menu:
Open lightbox
No zoom
Enable video looping
Enable/disable checkbox
Image ratio
Select image ratio from the dropdown menu:
Adapt to image
Square
Carousel thumbnail
(Use for Carousel thumbnail layout)
Carousel thumbnail direction
Set the position of the thumbnails:
Vertical: displays on the left of the main product image.
Horizontal: displays under the main product image.
Grid spacing (desktop)
Determines the grid spacing between columns of thumbnails on desktop devices. Can be from 0px to 50px, increasing arithmetically of 1px (pixel).
Grid spacing (tablet)
Determines the grid spacing between columns of thumbnails on tablet devices. Can be from 0px to 50px, increasing arithmetically of 1px (pixel).
Colors
Color scheme
Select a color scheme to set the text and background colors for the section
Section padding
Top padding
Determines the height of the top inner space of the section. Can be from 0px to 100px, increasing arithmetically of 1px (pixel).
Bottom padding
Determines the height of the bottom inner space of the section. Can be from 0px to 100px, increasing arithmetically of 1px (pixel).
Top padding on mobile
Determines the height of the top inner space of the section on mobile. Can be from 0px to 100px, increasing arithmetically of 1px (pixel).
Bottom padding on mobile
Determines the height of the top inner space of the section on mobile. Can be from 0px to 100px, increasing arithmetically of 1px (pixel).