In Shopify, a product card is a visual snapshot of a product, displaying essential details like image, title, and price. It streamlines the shopping experience by providing key information without requiring users to visit a separate product page, enhancing the overall user interface design.

To configure it, you will access Theme Settings > Product card.

1. Product Image

There are many options to config Product image:

• Show secondary image on hover: Disable this option if you want to show 1 image for product.

• Effect secondary image: There are 6 effects None, Opacity, Zoom, Move top to bottom, Flip, Rotate

• Product image custom ratio: An image's aspect ratio is the ratio of its width to its height. You will change ratio in the section.

2. Product buttons

• Show quick view

• Show ultra button: Ultra buttons are Quick add, Choose options, Add to cart, View product.

• Show quick add: Requires showed ultra button

• Show quantity selector: Requires showed ultra button and only show with button add to cart. Quantity selector button shows with Product Design 2,3,4,6,7,10

3. Product Info

• Text alignment: This option allows you change align text to Left, Center or Right.

• Show rating: To display a rating, add a product rating app.

4. Color list

• Color display mode: There are 3 options Hide, Count or Color List.

• Show color type: This option allows you show All color or Only color available.

Config below, requires color display mode is color list.

• Color shape: There are 2 options Square or Circle

• Color image source: There are 2 options Variant images or Custom images

• Change product image when click swatch on event: Swatch color will change when you Hover or Click

• Enable color limit: You can limit the swatch color to show with options below.

Maximum color to show: 0 to responsive auto number. Requires color limit is enabled.

Action after color view more is clicked: You have two options for it Expand all color or Go to product page. The require color limit is enabled.

5. Size list

• Size display mode: Hide, Count or Size list

• Show size type: All size or Only size available

6. Miscellaneous

Remove collection URL: Remove the collection portion from product URLs for better SEO.

7. Options for products on mobile

• Enable minimal product infos: Hidden countdown product, color, size list ...

Group product buttons.Only work on mobile

• Hidden add to cart on mobile

• Hidden quickview on mobile

• Hidden wishlist on mobile

• Hidden compare on mobile