Full detailed product card examples (default):

The two examples below are two different options on how to showcase products with full product card details. This includes the product name, price, stock status, compare and wishlist features. Preferably we will stick to the carousel in most cases. No class is needed for these options as they are the default.

Pagebuilder Product Carousel

Pagebuilder Product Grid


Using the pb__cards--menudropdown class

This class is used almost exclusively for the mega menu dropdown. It only gives the product name.


Using the pb__cards--clean class

This class will show the title and price of a product. Best used to keep busy pages a little cleaner.

Pagebuilder Product Grid


pb__cards--clean and product-grid--single-product

These two style combine to show one single clean product.


Product Recommendations

Product Recommendations pb__cards--clean