Product mixer

Section header

Heading: Add the heading of this section. Assisting options and formats: AI Generated content, Bold format, Italic format, and Insert a link.

Heading size: Select the size of the heading: Small, Medium, Large.

Subheading: Add the subheading of the section. 

Description: Add the description of the section. 

Alignment: Choose the alignment of the section header: Default (left) or Center.

Button label: Add text to the button label in the section header.

Button link: Enter the link destination for the button in the section header.

Open this link in a new window: Toggle this ON to open the link in a new window.

Section body

Desktop column: Select the number of product columns to display on desktop screens (e.g. 2).

Tablet column: Select the number of product columns to display on tablet screens (e.g. 2).

Mobile column: Select the number of product columns to display on mobile screens (e.g. 2).

Section layout

Color scheme: Adjust the color scheme of the section

Background image: Select an image as the section background. 

Section full width: Toggle this ON to display the section in full width.

Section max width: Adjust the maximum width of the section. Enter a pixel number (e.g. 1900 px).

Content full width: Toggle this ON to display the content in full width.

Content max width: Adjust the maximum width of the content. Enter a pixel number (e.g. 1900 px).

Padding desktop: Add spacing on the top of the section in the desktop view. Enter a pixel number (e.g. 5 px).

Padding tablet, mobile: Add spacing on the top of the section in tablet and mobile view. Enter a pixel number (e.g. 5 px).

Margin desktop Add spacing on the left of the section in the desktop view. Enter a pixel number (e.g. 5 px).

Margin tablet, mobile: Add spacing on the left of the section in tablet and mobile view. Enter a pixel number (e.g. 5 px).

Theme Settings

Show quick add button: Enable this option to display a quick add button on product cards, allowing customers to add products to cart without leaving the collection page.

Reveal sections on scroll: Enable this to reveal the section as users scroll, optimizing loading speed for the section.

Image ratio: Adjust the image ratio slider to control how product images are displayed within product cards.  

Show second image on hover: Enable this option to display a secondary product image when customers hover over a product card, helping them preview variations or additional angles.

Show product rating: Enable to display product ratings on product cards.
Note: A product rating app is required for ratings to appear.

Style: Choose a display style for your product cards. 

Style Default 

Style Variant

Style Creative

Show best seller label: Enable to highlight best-selling products with a label on product cards.

Best seller tag: Enter the text used for the best seller label (e.g., “Best Seller”).

Show sale label: Enable to display a sale label on discounted products, making promotions more visible.

Show new label: Enable to highlight newly added products with a “new” label.

End date after (days): Set the number of days a product is considered “new” before the label is automatically removed.

Show out of stock label: Enable to display an out-of-stock label on unavailable products, helping set clear expectations for customers.

Variant color scheme: Select a color scheme to display product variants (such as color swatches) consistently with your store design.

Show currency codes: Enable to display currency codes (e.g., USD, EUR) alongside prices for clarity, especially for international customers.

Show compare: Enable to show compare-at prices, helping customers see discounts more clearly.

Show quickview button: Enable to allow customers to preview product details in a quickview popup without leaving the current page.

Color scheme: Choose a color scheme applied to the overall product card elements.

Label: Enter custom label text used within the product card display (e.g., promotional or highlight text).

2.4.1. Block – Item 

Tab name: Add the name of this tab as it will appear in the navigation or selector.

Description: Add the descriptive text that explains or promotes the content of this tab.

Collection: Select the product collection to display products from in this tab.

Maximum products to show: Set the maximum number of products to display in this tab's grid or list. Enter a number (e.g. 12).