Featured product

Use this section to show your brand new or best-selling product. Here customers can get an overview of the product: study product media, see the price, available color, size, and other options, add the product to the cart, or order it directly.

GENERAL

Color scheme

Choose a separate color scheme for the section.

Width

Choose the width of the section on the page.

PRODUCT

Product

Select the product from the list of your products on the setting panel.

MEDIA

Desktop layout

Choose the layout of product media on desktop.

Thumbnails left

secondary media shows as thumbnails to the left of the enlarged featured image

Thumbnails right

secondary media shows as thumbnails to the right of the enlarged featured image

Thumbnails bottom

secondary media shows as thumbnails below the enlarged featured image

1 column stack

all media has the same size and shows in one column

2 column stack

all media has the same size and shows in two columns

1-2-1 column stack

the media has mixed size and shows as the sequence of one column and two column stacks

1-2-2 column stack

the media has mixed size and shows as one featured image at the top, followed by a two column stack

2-1-2 column stack

the media has mixed size and shows as the sequence of two column and one column stacks

Desktop space between media

Adjust the spacing between the media or thumbnails for all the layouts.

Desktop thumbnail size

Adjust the size of thumbnails for the corresponding desktop layouts.

Mobile layout

Choose the layout of product media on mobile.

Thumbnails left

secondary media shows as thumbnails to the left of the featured image

Thumbnails right

secondary media shows as thumbnails to the right of the featured image

Thumbnails bottom

secondary media shows as thumbnails below the featured image

Thumbnails bottom overlay

secondary media shows as thumbnails below the featured image, half-overlapping it

Slideshow linear

shows one media at a time with navigation circles at the bottom; the media gallery can be swiped back and forth

Slideshow looped

shows one media at a time with navigation circles at the bottom; the media gallery is looped

Carousel with 1,5 cards

shows one and a half cards with media at a time

Carousel with 2 cards

shows two cards with media at a time

Carousel with 2,5 cards

shows two and a half cards with media at a time

Image ratio

Choose the view and orientation of product media.

Show only selected variant’s media

Select to show only the media associated with the selected option value. Media for other option values will be hidden. Learn how to set up product media filtering.

Enable image zoom

Select to zoom the featured image when you click on it. You can tell the zoom is turned on by the changing pointer shape when you place it on the image.

Enable video looping

Select this option if you have videos among the product media and want the featured videos to start over after ending.

Enable video autoplay

Select this option if you have videos among the product media and want the featured videos to start automatically.

Scale video

Select this option if you have videos among the product media and want to scale the featured videos to fill the whole product card.

Show part of next slide on mobile

Select to show part of the side card in the product media carousel so that you know there are more cards to see if you scroll right or left.

PADDINGS

Add side paddings

Select to add extra space on the sides between the section and the screen.

Top padding

Adjust the space between the section and the previous element on the page.

Bottom padding

Adjust the space between the section and the following element on the page.

ADD PRODUCT BLOCKS

Add and customize blocks for fine adjustment of the section view: choose how and what information to show about the product.

pageInfo blockspagePricepageBuy buttonspageVariant pickerpageInventory statuspageDescriptionpageContent tabpageCustom liquidpageButtonpageInformation tagpageDrawer with tabspageProduct badgespageCountdown timer

Last updated