ProductList

ProductList

Documentation

A specialized card list for product content. Shares CardList layout and styling behavior while using ProductCard entries instead of Card entries.

Kind

Built Content

Required fields

products, type

Style Guide

Used by

Authoring guidance

Use when

Use when the cards represent products with structured product fields such as price, merchant, image, and CTA.

Avoid when

Items are generic content rather than products; use card-list.

Properties

cardClass

string

Optional theme styling hook of the individual children cards.

class

string

Optional styling hook.

columns

number

Controls the preferred number of cards per row; the grid may use fewer columns when space is limited.

minimum: 1 · maximum: 4 · integer only (no decimals)

*

products

Products rendered in authored order.

*

type

string

Identifies the Element type represented by this object.

"product-list"

Example

Required

{ "products": [], "type": "product-list" }

Full

{ "cardClass": "example", "class": "example", "columns": 2, "products": [ { "name": "Birds of Utah", "description": "A field guide to birds found throughout Utah.", "price": 399, "merchant": "Example Books", "link": { "href": "https://example.com/birds-of-utah", "sponsored": true } } ], "type": "product-list" }

examples are generated from the schema.