Short codes
Product Detail Page
36 tokens under the pdp.* namespace. Drop these anywhere the SSR layer can see them — HTML, attribute values, JS, or CSS.
Overview
36 tokens under the pdp.* scope. Resolves on pdp pages only.
Usage
Drop a token anywhere the SSR layer will see it — HTML body, attribute value, inline JS, or inline CSS.
Inline in markup
<mmm-pdp-title>{{pdp.title}}</mmm-pdp-title>
<!-- rendered -> -->
<mmm-pdp-title>Peace Lily Plant - Indoor Air Purifying</mmm-pdp-title>Inside attribute values
<a href="/p/{{pdp.slug}}" title="Buy {{pdp.title}} for {{pdp.price}}">Shop</a>Identity & flags 13
TokenPage bindingComponentDescription & sample
{{pdp.title}}pdppdp-title.jsProduct display nameSample:
Peace Lily Plant - Indoor Air Purifying{{pdp.slug}}pdppdp-title.jsProduct URL slugSample:
peace-lily-plant-indoor{{pdp.label}}pdppdp-title.jsPromotional label (e.g. "Exclusive")Sample:
Exclusive{{pdp.available}}pdppdp-title.jsWhether the product is in stock booleanSample:
Yes{{pdp.has_variants}}pdppdp-variants.jsWhether the product offers variant options booleanSample:
Yes{{pdp.no_of_variants}}pdppdp-variants.jsNumber of variant options for this product numberSample:
2{{pdp.price}}pdppdp-price.jsCurrent selling price (formatted with currency) currencySample:
₹ 1,000{{pdp.description}}pdppdp-description.jsLong description (HTML preserved) htmlSample:
<p>The Peace Lily plant…</p>{{pdp.short_description}}pdppdp-short-description.jsShort description (HTML preserved) htmlSample:
<p>The Peace Lily plant…</p>{{pdp.image}}pdppdp-gallery.jsPrimary product image (full size) urlSample:
https://cdn.commmerce.com/.../image.webp{{pdp.media_count}}pdppdp-gallery.jsTotal number of media items (images + videos) numberSample:
4{{pdp.rating}}pdppdp-rating.jsAverage rating scoreSample:
4.5{{pdp.wishlisted}}pdppdp-wishlist.jsWhether the product is in the user's wishlist booleanSample:
NoCart 2
TokenPage bindingComponentDescription & sample
{{pdp.cart.qty}}pdppdp-add-to-cart-buy-now.jsQuantity of this product already in the cart numberSample:
0{{pdp.cart.item_code}}pdppdp-add-to-cart-buy-now.jsCart item code linking the cart row to this productImage 2
TokenPage bindingComponentDescription & sample
{{pdp.image.thumb}}pdppdp-gallery.jsPrimary product image (thumbnail size) urlSample:
https://cdn.commmerce.com/.../thumb.webp{{pdp.image.alt}}pdppdp-gallery.jsAlt text for primary image (falls back to product name)Sample:
Peace Lily Plant - Indoor Air PurifyingMeta 3
TokenPage bindingComponentDescription & sample
{{pdp.meta.title}}pdppdp-shared-utils.jsSEO meta title for the PDPSample:
Peace Lily Plant - Buy Online{{pdp.meta.description}}pdppdp-shared-utils.jsSEO meta descriptionSample:
Buy the Peace Lily Plant online…{{pdp.meta.keywords}}pdppdp-shared-utils.jsSEO keywordsSample:
peace lily, indoor plantOffer 2
TokenPage bindingComponentDescription & sample
{{pdp.offer.first}}pdppdp-offer.jsFirst active offer lineSample:
Applicable on Orders above ₹2499{{pdp.offer.count}}pdppdp-offer.jsNumber of offers active for this product numberSample:
4Price 7
TokenPage bindingComponentDescription & sample
{{pdp.price.selling}}pdppdp-price.jsSelling price (raw number) numberSample:
1000{{pdp.price.original}}pdppdp-price.jsOriginal (struck-through) price currencySample:
₹ 2,000{{pdp.price.original_raw}}pdppdp-price.jsOriginal price (raw number) numberSample:
2000{{pdp.price.discount}}pdppdp-price.jsDiscount percentageSample:
50% OFF{{pdp.price.discount_value}}pdppdp-price.jsDiscount amount (raw number)Sample:
0.00{{pdp.price.starts_at}}pdppdp-price.jsRange starting price (when product has price ranges){{pdp.price.type}}pdppdp-price.jsPricing type ("fixed" or "range")Sample:
fixedRating 2
TokenPage bindingComponentDescription & sample
{{pdp.rating.total}}pdppdp-rating.jsTotal number of ratings numberSample:
328{{pdp.rating.reviews}}pdppdp-rating.jsTotal number of written reviews numberSample:
85Variant 5
TokenPage bindingComponentDescription & sample
{{pdp.variant.name}}pdppdp-variants.jsActive variant option name (e.g. "Size")Sample:
Size{{pdp.variant.display_mode}}pdppdp-variants.jsHow the variant picker renders ("tab", "swatch", …)Sample:
tab{{pdp.variant.selected.name}}pdppdp-variants.jsSelected variant value (e.g. "Small")Sample:
Small{{pdp.variant.selected.code}}pdppdp-variants.jsSelected variant codeSample:
PEACE_LILY_SMALL{{pdp.variant.selected.price}}pdppdp-variants.jsPrice of the currently selected variant currencySample:
₹ 1,000Tips
- Tokens are case-sensitive —
{{pdp.title}}resolves;{{PDP.TITLE}}does not. - Whitespace inside the braces is tolerated:
{{ pdp.title }}works identically. - Unresolvable tokens fall through as empty strings rather than rendering the raw placeholder, so missing-data states stay clean.