Product Details

The product details page (PDP) is the most complex page in the application. It consists of a variety of complexe sub-components that are needed to display the product details.

Image

Name Description
product.image.before Components are rendered before the product image.
product.image Components replace the product image on the PDP.
product.image.after Components are rendered after the product image.

Header

Name Description
product.header.before Components are rendered before the product header.
product.header Components replace the complete product header on the PDP.
product.header.after Components are rendered after the product header.

Instead of replacing the whole product header, you can manipulate the individual components on their own:

CTAs

Name Description
product.ctas.before Components are rendered before the CTAs.
product.ctas Components replace the CTAs on the PDP.
product.ctas.after Components are rendered after the CTAs.

Favorites CTA

Name Description
product.ctas.favorites.before Components are rendered before the Favorites CTA button.
product.ctas.favorites Components replace the Favorites CTA button.
product.ctas.favorites.after Components are rendered after the Favorites CTA button.

Add to Cart CTA

Name Description
product.ctas.add-to-cart.before Components are rendered before the “Add to Cart” CTA button.
product.ctas.add-to-cart Components replace the “Add to Cart” CTA button.
product.ctas.add-to-cart.after Components are rendered after the “Add to Cart” CTA button.

Rating

Name Description
product.rating.before Components are rendered before the rating.
product.rating Components replace the rating on the PDP.
product.rating.after Components are rendered after the rating.

Name

Name Description
product.name.before Components are rendered before the product name.
product.name Components replace the product name on the PDP.
product.name.after Components are rendered after the product name.

Product Info

Product Info includes important information like shipping information, availability, and price information.

Name Description
product.info.before Components are rendered before the product info.
product.info Components replace the whole product info block.
ATTENTION: Please use this with caution!
product.info.after Components are rendered after the product info.

The Product Info block is split into two rows. You may also replace the content of each.

Name Description
product.info.row1 Components replace the 1st row of the Product Info.
product.info.row2 Components replace the 2nd row of the Product Info.

Manufacturer

Name Description
product.manufacturer.before Components are rendered before the product manufacturer information.
product.manufacturer Components replace the manufacturer information on the PDP.
product.manufacturer.after Components are rendered after the product manufacturer information.

Shipping

Name Description
product.shipping.before Components are rendered before the product shipping information.
product.shipping Components replace the shipping information on the PDP.
product.shipping.after Components are rendered after the product shipping information.

Availability

Name Description
product.availability.before Components are rendered before the product availability information.
product.availability Components replace the availability information on the PDP.
product.availability.after Components are rendered after the product availability information.

Striked Price

Name Description
product.price-striked.before Components are rendered before the striked price.
product.price-striked Components replace the striked price on the PDP.
product.price-striked.after Components are rendered after the striked price.

Price

Name Description
product.price.before Components are rendered before the price.
product.price Components replace the price on the PDP.
product.price.after Components are rendered after the price.

Price Info

Name Description
product.price-info.before Components are rendered before the price info.
product.price-info Components replace the price info on the PDP.
product.price-info.after Components are rendered after the price info.

Tier Prices

Name Description
product.tiers.before Components are rendered before the tier prices.
product.tiers Components replace the tier prices on the PDP.
product.tiers.after Components are rendered after the tier prices.

Variant Selects

Name Description
product.variant-select.before Components are rendered before the product variant selection section.
product.variant-select Components replace the product variant selection section.
product.variant-select.after Components are rendered after the product variant selection section.

Variant Selects Picker Availability Label

Name Description
product.variant-select.picker.availability.before Components are rendered before the availability label within a variant selection picker.
product.variant-select.picker.availability Components replace the availability label within a variant selection picker.
product.variant-select.picker.availability.after Components are rendered after the availability label within a variant selection picker.

Options

Name Description
product.options.before Components are rendered before the product option section.
product.options Components replace the product option section.
product.options.after Components are rendered after the product option section.

Description

Name Description
product.description.before Components are rendered before the product description.
product.description Components replace the product description.
product.description.after Components are rendered after the product description.

Properties

Name Description
product.properties.before Components are rendered before the product properties.
product.properties Components replace the product properties.
product.properties.after Components are rendered after the product properties.

Reviews

Name Description
product.reviews.before Components are rendered before the product reviews.
product.reviews Components replace the product reviews.
product.reviews.after Components are rendered after the product reviews.

Tax Disclaimer

Name Description
product.tax-disclaimer.before Components are rendered before the tax disclaimer.
product.tax-disclaimer Components replace the tax disclaimer.
product.tax-disclaimer.after Components are rendered after the tax disclaimer.

Add to Cart Bar (iOS only)

Name Description
product.add-to-cart-bar.before Components are rendered before the “Add to Cart Bar”.
product.add-to-cart-bar Components replace the “Add to Cart Bar”.
product.add-to-cart-bar.after Components are rendered after the “Add to Cart Bar”.