Product cards

To set up a product card, go to the section Settings and select the Card tab.

NOTE:

All product cards in one section have common settings — it's impossible to set up each card individually. Any change is applied to the whole section.

It sets up the card layout of the Products section. This is the Vertical orientation:

This is the Horizontal orientation:

The Card orientation setting is applied to the whole section.

This option works like a card builder; it lets users decide which information will appear in the card.

Here you can set up the look of images or sliders.

You can also select the Action on click: what happens when a user clicks on the image.

Select the font, color and padding around the product name.

Set up the way the product options are displayed

If you want your product cards to look  minimalistic and clutter-free, you can hide displaying options in them. To do this, remove Options from the card layout. In this case, product variants  will appear in the pop-up when a product is added to the cart.

To show product variants in the card again, select Options from the list of Card elements.

Click Add element to select more components for the product card: SKU, description, availability, price, button, button paired with price or availability, divider. The selected element is added to all product cards in the section.

To customize any card element, click on the Setting to its right.

To delete any card element, click on the trash icon to its right.

If you select Color, then the color of card cards will differ from the background color.

Click Background color and select a need color in the color picker.

The selected color will become the card color.

If you select No background, the card will be transparent.

You can also set up padding, text color, effect on hover, etc. — everything that affects the look of the product cards.