Compare popup settings

Apply color scheme for the drawer from suggested color schemes list.

Read 'Color scheme' article to learn more about color schemes.

Choose the button’s appearance in compare drawer:

• Primary: The main button style. It uses the primary color from your color scheme. You can choose to fill it with the background color or display it as an outline if the background is set to transparent.
• Secondary: A secondary action style, using the secondary color from your color scheme. Like the primary button, it can be filled or outlined depending on the background settings.

This setting lets you add a small visual indicator to your button.

• None: The button displays only the text, with no icon.
• Dot: A small dot appears before the button label.

Apply color scheme for the popup from suggested color schemes list.

Read 'Color scheme' article to learn more about color schemes.

Choose the button’s appearance in the popup:

• Primary: The main button style. It uses the primary color from your color scheme. You can choose to fill it with the background color or display it as an outline if the background is set to transparent.
• Secondary: A secondary action style, using the secondary color from your color scheme. Like the primary button, it can be filled or outlined depending on the background settings.

This setting lets you add a small visual indicator to your button.

• None: The button displays only the text, with no icon.
• Dot: A small dot appears before the button label.

Choose the aspect ratio for product images in the compare popup:

• Portrait – vertical image format
• Square – equal width and height
• Landscape – horizontal image format

Choose the heading size for product titles in the compare popup:

• Small
• Medium
• Large

1) Enter vendor name on every product detail page and customer will see it later through this pop-up.

2) Add the Vendor block under Compare section.

3) Enter the name in Row title field: you can enter Vendor or another custom name for this field.

Three variant option blocks can be added to the compare section.

1. Create variant options on the product detail page.
2. Enter the name in Row title field: you can enter Variant option, Product option, or another custom name for this field.

Enter the same name of the variant that you assigned on the product detail page.

For example, if you created a color variant with options, enter “Color” in this field to display the options in the popup.

You can also use this field for other variant types, such as Size, Design, Weight, Height, and more.

Enter the variant name from the product detail page only if the variant is a color swatch.

For example, if the variant represents Size, leave this field empty.

• You can create metafield with additional product characteristics and fill it on every detail page, then add it through Connect Dynamic source.
• You can create a lof of metafield blocks. Each created metafield block is a new characteristic about the product.
• In Row title, give a name of each metafiled.

Enter the product SKU in the SKU field on each product detail page. If the product has no variants, add the SKU to the product itself. If the product has variants, add the SKU to the first variant so it will be visible in this popup.

2) Add the Product SKU block under Compare section.

3) Enter the name in Row title field: you can enter Product SKU or another custom name for this field.

1) Enter product description in the Product description rich text field on every product detail page, and customer will see it later through this pop-up.

2) Add the Product description block under Compare section.

3) Enter the name in Row title field: you can enter Product Description or another custom name for this field.

• Link to product: The View product button opens the product detail page of the related product in the popup.
• Add to cart: If the product has a single variant or no variants, the Add to cart button will add the product directly to the cart drawer. If the product has multiple variants, the Choose options button will appear and open the quick view popup.

Choose the button’s appearance:

• Primary: The main button style. It uses the primary color from your color scheme. You can choose to fill it with the background color or display it as an outline if the background is set to transparent.
• Secondary: A secondary action style, using the secondary color from your color scheme. Like the primary button, it can be filled or outlined depending on the background settings.

This setting lets you add a small visual indicator to your button.

• None: The button displays only the text, with no icon.
• Dot: A small dot appears before the button label.