Product cards are used all over the store. You can find them in a lot of sections, on your collection page, and on the recommended section of your product page.
To access the Product & Collection cards settings, click Customize (Themes section on Shopify) > click on Theme settings > Cards, Product Cards, Collection Cards.
Cards theme settings
How many cards per row? (Desktop/Mobile)
Space between Cards
How to use Card Image Fit
We offer this setting to help you in fitting the images accurately. You may face trouble in fitting the image of your product in the card. When your image doesn't fit the available card's ratio setting, you can choose to alter your images. You are either required to:
- Preserve Ratio: We offer this setting for you to display the entire image in the dimension it initially has. However, some amount of white/empty space can appear on the sides of the card.
- Adjust the ratio to hide the space: If the ratio of the image doesn't match the ratio of cards, images can be altered to fit the card ratio. The product images are then cropped and adjusted in such a way so that it fits the card perfectly well, leaving no white spaces.
You can select either of the two options to fit your product images in the cards to be displayed properly, and the visitor can determine their choices.
Product Cards
The theme provides five diverse options for the user to try different settings and check how it looks. The different options provided are: Default(1), Show the Button on Hover(2), Slide the Button on Hover(3), Hide Button(4), Catalog(5).
Show product gallery instead of a single image
This setting will replace the product card image with a gallery of images, allowing the customers to navigate through the different product pictures.
Displaying the Secondary Product Image on Hover
We offer this setting in the latest version of Booster Theme so that you can choose to display an image of the secondary product when the mouse pointer is brought over the image. The user, when placing the pointer over it, the image of the secondary product is displayed.
Text Alignment
With this setting, you can choose to alter the text's alignment that is placed in the store.
There are three varied options provided for the user to choose: Left(1), Center(2), Right(3). Choose the option that goes well with the design of your store.
Display the Brand Name of a Product
You have products listed from different brands. We provide the option of adding brand names of the respective product. This option allows you to do so. Brand Name is displayed beneath your product's image so that the visitor while scrolling through the options, knows which brand the product belongs to. Type the brand name in the field provided.
Show Review Rating Stars
Consumers often check for a review of the product to know the experience of others. This setting will display the review star rating beneath the product card.
Collection cards
With this setting, you can easily alter a collection card image you are using in your Shopify store. There are four varied options provided that help you to set one that is highly preferred. These settings will modify the collection cards on the Collection list page.
The four different options provided include Default(1), Show text inside the product card(2), Show button inside when the user hovers(3), Hide Text(4).
