Product Detail
Product Title
PDP product title block with brand line, product name, and optional brand logo.
Overview
ProductTitle is the title block at the top of the PDP content column. It renders the brand line, the product name, and an optional brand logo image. Props are brandTitle?: string, title: string, and brandLogo?: Media.
Auto-import tag: <LProductTitle>.
Key Business & UX Benefits
- Brand line and clear product name match the way shoppers scan PDPs, putting the recognizable signal above the line where it earns trust.
- Optional brand logo lets premium and licensed catalogues show provenance at a glance, supporting conversion on branded categories.
- Heading hierarchy is tuned for SEO and screen readers, so the same component handles search ranking and accessibility together.
Usage
ProductTitle Default
<ProductTitle :brand-title="product.brand" :title="product.title" :brand-logo="product.brandLogo" />
Feature List
- brandTitle prop renders the brand line above the product name so the recognizable signal earns trust before the title scans
- Optional brandLogo prop surfaces the brand mark next to the title for licensed and premium catalogues
- Heading hierarchy tuned for SEO and screen readers, so search ranking and accessibility share one component
- Drops into the PDP content column above PriceInfo and BenefitsBox, completing the buy-box top section
- Pure data-driven render so swapping titles for A/B tests needs no template change
API Reference
| Prop | Default | Type |
|---|---|---|
titlerequired | string | |
brandTitle | string | |
brandLogo |