Product card partial

One prepared product card. The card is a local input, not a viewModel root.

Output: HTML partial.

Data

Shared structures available in recorded contexts: security.

Additional inputs

Input	Type	Default / purpose
productCard	object	Prepared card from catalog.items, home.sections[].products, wishlist.items or product recommendations.
productCardIndex	number	0; presentation index.
productCardHeadingTag	string	h3; allowed h2 or h3.
productCardImageLoading	string	lazy; allowed eager or lazy.
productCardShowBadges	boolean	true.
productCardShowVariantPreview	boolean	true.

Card structure

Field	Type	Meaning	Availability
productCard.badges	array	Prepared badges collection; may be empty.	When the parent is provided; check optional fields.
productCard.badges[].color	string	Color value supplied for this context.	For each existing item; optional child fields depend on item type.
productCard.badges[].key	string	Key value supplied for this context.	For each existing item; optional child fields depend on item type.
productCard.badges[].label	string	Label value supplied for this context.	For each existing item; optional child fields depend on item type.
productCard.comparePriceLabel	string	Prepared compare price display text.	When the parent is provided; check optional fields.
productCard.hasImage	boolean	Whether image applies; use for display only.	When the parent is provided; check optional fields.
productCard.image	object	Image data; check child fields before use.	When the parent is provided; check optional fields.
productCard.isDiscounted	boolean	Whether discounted applies; use for display only.	When the parent is provided; check optional fields.
productCard.manufacturerId	number	manufacturer identifier; do not load data with it.	When the parent is provided; check optional fields.
productCard.manufacturerName	string	Manufacturer name value supplied for this context.	When the parent is provided; check optional fields.
productCard.name	string	Name value supplied for this context.	When the parent is provided; check optional fields.
productCard.priceLabel	string	Prepared price display text.	When the parent is provided; check optional fields.
productCard.primaryImageMediaAssetId	number	primary image media asset identifier; do not load data with it.	When the parent is provided; check optional fields.
productCard.productId	number	product identifier; do not load data with it.	When the parent is provided; check optional fields.
productCard.shortDescription	string	Short description value supplied for this context.	When the parent is provided; check optional fields.
productCard.sku	string	Sku value supplied for this context.	When the parent is provided; check optional fields.
productCard.tagline	string	Tagline value supplied for this context.	When the parent is provided; check optional fields.
productCard.url	string	Prepared url URL; use unchanged.	When the parent is provided; check optional fields.
productCard.variantPreview	object	Variant preview data; check child fields before use.	When the parent is provided; check optional fields.
productCard.variantPreview.groups	array	Prepared groups collection; may be empty.	When the parent is provided; check optional fields.
productCard.variantPreview.groups[].items	array	Prepared items collection; may be empty.	For each existing item; optional child fields depend on item type.
productCard.variantPreview.groups[].items[].color	string	Color value supplied for this context.	For each existing item; optional child fields depend on item type.
productCard.variantPreview.groups[].items[].image	object	Image data; check child fields before use.	For each existing item; optional child fields depend on item type.
productCard.variantPreview.groups[].items[].label	string	Label value supplied for this context.	For each existing item; optional child fields depend on item type.
productCard.variantPreview.groups[].items[].type	string	Type value supplied for this context.	For each existing item; optional child fields depend on item type.
productCard.variantPreview.groups[].items[].url	string	Prepared url URL; use unchanged.	For each existing item; optional child fields depend on item type.
productCard.variantPreview.groups[].items[].value	string	Value value supplied for this context.	For each existing item; optional child fields depend on item type.
productCard.variantPreview.groups[].label	string	Label value supplied for this context.	For each existing item; optional child fields depend on item type.
productCard.variantPreview.groups[].remainingCount	number	Remaining count numeric value.	For each existing item; optional child fields depend on item type.
productCard.variantPreview.groups[].type	string	Type value supplied for this context.	For each existing item; optional child fields depend on item type.
productCard.variantPreview.groups[].variantGroupId	number	variant group identifier; do not load data with it.	For each existing item; optional child fields depend on item type.
productCard.variantPreview.hasVariants	boolean	Whether variants applies; use for display only.	When the parent is provided; check optional fields.
productCard.variantPreview.items	array	Prepared items collection; may be empty.	When the parent is provided; check optional fields.
productCard.variantPreview.items[].color	string	Color value supplied for this context.	For each existing item; optional child fields depend on item type.
productCard.variantPreview.items[].image	object	Image data; check child fields before use.	For each existing item; optional child fields depend on item type.
productCard.variantPreview.items[].label	string	Label value supplied for this context.	For each existing item; optional child fields depend on item type.
productCard.variantPreview.items[].type	string	Type value supplied for this context.	For each existing item; optional child fields depend on item type.
productCard.variantPreview.items[].url	string	Prepared url URL; use unchanged.	For each existing item; optional child fields depend on item type.
productCard.variantPreview.items[].value	string	Value value supplied for this context.	For each existing item; optional child fields depend on item type.
productCard.variantPreview.remainingCount	number	Remaining count numeric value.	When the parent is provided; check optional fields.

Assets

The reference package uses its bundled theme CSS, Bootstrap and theme JavaScript. Account and checkout controls use the bundled checkout script. Partials use their caller’s resolved assets.

Example

Resolve this partial after setting its documented inputs:

<cfinclude template="#request.resolveStorefrontView('partials/product_card.cfm', viewModel.theme.key)#">

Navigation branches use cfmodule with their documented attributes instead of cfinclude.

Behaviour

Use prepared URLs and labels. Encode plain text and HTML attributes; preserve only explicitly prepared HTML.