Featured product settings

Setting	Description
Product	The “Product” option allows you to add a link to a specific product in your store. When you click on the “Select Product” button, you have two options: If the product has not been created yet, you can click on the “Create product link” button, which will take you to the “Add product” page where you can enter all the necessary information for your product. Once you have saved your changes, you can go back to the original section and your newly created product will be available to select. If the product has already been created, you can select it from the list of products by clicking on the “Select” button next to the product. The chosen product will then appear on the page.
Enable sticky content on desktop	When the button is swiped to the right, the product media and content below will always remain visible side by side with the main product information.
Desktop content position	Select the position of the content relative to the media: Top Center Bottom
Color scheme	A color scheme consists of a predefined set of colors you can apply to this section for consistent styling. These schemes are created in the Theme Settings and are available across all sections, making customization faster and ensuring a cohesive color system throughout your store. Learn more about color schemes.
Show secondary background	Swipe the button to the right to add a background color for whole section, different form container with image and content.
Show badges	Turn this option on to display badges (e.g., “Sale”, “New”, or custom labels) directly on top of the product image.
Badges color	Options: • Default (Default) • Inverse to product Only available when Show badges is turned on.

Media settings

To add media, navigate to Dashboard > Products, and select the specific product you wish to edit from the list. There are three product media types that can be added to the product page:

Images

3D models

Videos

Please read this detail information about media types.

Setting	Description
Desktop layout	This option refers to the way in which product images are displayed in the featured product section. There are four options available to choose: Stacked: Clicking an every stacked media type opens a pop-up window with a larger view of the selected media. All media is displayed in a two-column layout following the big main product media. Column: All media is displayed in a one-column layout. 2 columns: All media is displayed in a two-column layout, except video, and 3D models. Thumbnails: When a product has multiple media types, the additional media are shown as thumbnails below the main product media. Customers can click on any thumbnail to view it. Carousel: When a product has multiple media types, all media are shown in a carousel after the first product media. Customers can use the carousel navigation arrows to see other media.
Desktop thumbnail position	If in desktop layout, thumbnails are selected, you can adjust their position on desktop: Left Bottom Right
Mobile layout	2 columns: All media content is displayed in a two-column layout within the slider. Show thumbnails: When a product has multiple media types, the additional media are shown as thumbnails below the main product media. Hide thumbnails: With this setting, product media are displayed in a one column layout, allowing you to navigate through each image one after the other by swiping or clicking on dots below.
Desktop media position	Choose the media position: Left: Media left, content right. Right: Media right, content left. Note: Position is automatically optimized for mobile.
Desktop media width	Options: Small / Medium (Default) / Large. Note: Media is automatically optimized for mobile.
Media fit	Controls how media is sized within its container. Options: • Original (Default) — shown at natural proportions, no cropping. • Fill — scaled and cropped to completely fill the container.
Image background	Controls whether the space around a transparent image shows a solid color. Options: • Transparent (Default) • Background Background color will be visible if the image is transparent (.png).
Constrain media to screen height	Limits every image or video to the height of the visitor's browser window, so no single item forces extra scrolling. Enabled by default.
Hide other variants' media after selecting a variant	Hides the media of every other variant from the gallery once a customer selects a specific variant. Disabled by default.
Image zoom	Controls how customers can get a closer look at product images. Options: • Open lightbox (Default) — click opens the image full-size in an overlay. • Click and hover — zoom by clicking or hovering directly on the page. • No zoom Click and hover defaults to open lightbox on mobile.
Enable video looping	When enabled, product videos automatically restart and replay once they reach the end. Disabled by default.

Section padding

Setting	Description
Top padding	The "Top padding" setting allows you to adjust the amount of space at the top of the section using a slider.
Bottom padding	The "Bottom padding" setting functions similarly to the “Section top padding” setting, but controls the space at the bottom of the section.
Top padding mobile	The "Top padding mobile" setting allows you to adjust the amount of space at the top of the section specifically for mobile devices, using a slider.
Bottom padding mobile	The "Bottom padding mobile" setting works similarly to the "Top padding mobile" setting but controls the space at the bottom of the section for mobile devices.