Commmerce Docs
← Web Components

Web Components · Product Detail (PDP)

<mmm-pdp-offer-badge>

Inline offer badge attached to the gallery or price.

What it is

A compact badge variant of— small enough to overlay on the gallery.

When to use

  • Gallery corner badge
  • Above the price

Attributes

AttributeTypeDefaultDescription
data-offer-idstringautoSpecific promo to show.
idstring—Unique element identifier.
classstring—Custom CSS class list.
hiddenbooleanfalseHide the element without removing it from the DOM.

Examples

Default

Small inline promo chip.

<mmm-pdp-offer-badge></mmm-pdp-offer-badge>