Schema-only template for a product cards section.

Introduction

A card section organizes products into visually distinct blocks, typically arranged in a grid or carousel to enable quick browsing and comparison.

Common in e-commerce, feature pages, and landing pages, product cards highlight key details to drive engagement and conversions.

Personalizing the products shown, such as surfacing items based on browsing history or purchase intent, and testing different layouts, imagery, or calls to action can improve relevance and boost performance.

Usage

To add this component to your workspace, run:

npx croct@latest use croct://ui/block/product-cards-section
Other templates from
CroctCroct
An announcement bar with a location-based message.
Geomarketing strategy

An announcement bar with a location-based message.

CroctCroct
Component template for a carousel section.
Carousel section

Component template for a carousel section.

CroctCroct
A personalized experience based on marketing campaigns.
Marketing campaign experience

A personalized experience based on marketing campaigns.

CroctCroct
Component template for an announcement bar.
Announcement bar

Component template for an announcement bar.

CroctCroct

Start building in seconds

Paste the following command in your terminal and let the CLI do the rest.

npx croct@latest init