Introduction
The Product Header Block serves as the entry point for a PDP and contains all configurable options available for the product being viewed. This block also contains the primary call to action for a PDP, adding to basket or linking through to approved retailers.
Anatomy
Key Content
Item | Type | Notes |
Breadcrumbs | Component | optional |
Product name | Typography | |
Sub heading (product variant) | Typography | optional |
Description | Typography | |
CTA block labels | Typography | |
Image carousel | Component | |
Disclaimer | Typography | optional |
Visual Style
Usage
Do’s
Use once on a PDP
Use all available props to clearly describe and categorise the product.
Don’ts
Over describe the product
Use on any page that isn’t a PDP
Use multiple instances of this component on a single page.
Include too many product images
Related/Similar Components
Headers