Product card display on search and category pages
Key Takeaway
Product cards come from the Product Card component placed inside the Results Grid component. On a store created before Summer '24, replace the Results component with the Results Grid component first. Keep the Results Grid component's Expression Prefix matched to the Product Card component's Data Binding.
Product cards are the tiles that show each product on a B2B store's product list page, which includes search results and category pages. Two Experience Builder components display them. The Results Grid component controls how the cards are laid out. The Product Card component sits inside it and shows the products. Administrators set the layout, paging and hover behavior in these two components' settings.
How product cards are built
Two Experience Builder components work together to show product cards on the product list page. The Results Grid component controls how the cards are laid out. The Product Card component goes inside the Results Grid component and shows the products.
Whether the Results Grid component is already in place depends on when the store was created.
If your store was created after the Summer '24 release...
The Results Grid component is configured by default.
If your store was created before Summer '24...
You must add the Results Grid component and configure it in Experience Builder. On the search page, the Results Grid component replaces the Results component.