What is a product card and what should it include?
You know when you search for something in an online shop and then see all the results displayed with photos and prices? Those images that you see are called product cards. When you click on a product card, it usually brings you to the product page, where you see photos, variations of the product and a bunch of other things depending on what the shop sells.
These product cards have the power to display much more than just the price and photos though. Depending on your strategy as a shop owner, you can include (or not) things like an add to cart button or a discount price. You should also be able to decide how images are displayed and have the ability to individually adjust how different text on the product card is displayed.
All of these tweaks will help you create a product card that is not just on brand, but also helps you choose how you want customers to interact with your products via your shop's search. Here’s what you need to know about a product card and how to make the most out of yours.
Deciding what elements to show
Your product card can show a lot more than just the image of your product. Subtle changes in what you add to your product card can influence how your shoppers navigate your store and purchase your product. Depending on what you’re selling and the goals of your shop, you may want to include different features on your product card. If you’re using Motive Commerce Search, your product card has multiple features that have been carefully curated and designed to make sure your shop can adapt to shopper expectations.
Should you display an add to cart button?
You would think every product card on every online shop uses an add to cart button. It seems logical. But that’s not the case. Having the ability to display or not display an add to cart button on your product card could help you increase sales by letting customers directly add your product, or help you guide your customers into viewing the products in more detail to then make a sale from the product page.
Depending on what your products are and how your customers shop, you may decide to display the add to cart button on your product card or not. It all depends on your strategy.
Divider Lines to divide price and title
If you want to make a more obvious separation between your product title and price, you can use something called divider lines. The gourmet food and wine shop Coalla have been using this Motive Commerce Search feature to separate their add to cart button and price on a new line. This helps customers see prices and add products that don’t necessarily need to be viewed on their product page in a quick and easy way.
Content Alignment
With your product card, flexibility is key. Using some examples from Motive customers, product cards should allow you to align your content to the side like Coalla, or centrally, like Inside Shops.
How to display product images
Some products look better depending on how they’re displayed. Think of the image like how a product is displayed on a shelf in a highstreet shop. By having the option to change things like the height and fit of your product card, you can make sure your search blends seamlessly with the images in your catalogue.
Image fit
Your catalogue might have grown over the last few months or years, and the product photos you’ve taken might be a mix of horizontal and vertical images. If this is the case, you can use the image fit tool to make your images fit or fill the product card to keep everything looking neat, tidy and on brand.
Image size
You can also use the image size feature of Motive Commerce Search to display your product in square or taller rectangular images. Checking out this example from Inside Shops, you can see how they’ve used the image size feature of Motive Commerce Search to give their product cards more height, something that many fashion retailers do.
Using Text Styles
Text styles help you stick to your brand image. Adjusting the font size, weight colour and whether text is capitalised or not is a great way to get the product card looking exactly as you want.
Having the ability to adjust the text styles of different parts of the product card allows you more control over how certain information is displayed. You could use different text styles for the product title, price and discount price. You might want to display your discount price in a light grey, or give it more prominence with a bright red. Either way, with Motive Commerce Search, you have full control.
Get your hands on these great features now
If you’re already using Motive Commerce Search, you can access these features from your Playboard right away. Just go to the search layer in the sidebar and click visual customisations.
If you’re not yet using Motive Commerce Search but want to try out these great features in your own shop, you can get 30 days to test everything out for free when you sign up here.