Short codes

Category

5 tokens under the category.* namespace. Drop these anywhere the SSR layer can see them — HTML, attribute values, JS, or CSS.

Overview

5 tokens under the category.* scope. Resolves on category 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>{{category.name}}</mmm-pdp-title>
<!-- rendered -> -->
<mmm-pdp-title>Indoor Plants</mmm-pdp-title>

Inside attribute values

<a href="/p/{{pdp.slug}}" title="Buy {{pdp.title}} for {{pdp.price}}">Shop</a>

Identity & flags 5

TokenPage bindingComponentDescription & sample
{{category.name}}categoryproduct-filter.jsCategory display name
Sample: Indoor Plants
{{category.slug}}categoryproduct-filter.jsCategory slug
Sample: indoor-plants
{{category.description}}categoryproduct-filter.jsCategory description html
Sample: Air-purifying plants for any space.
{{category.product_count}}categoryproduct-filter.jsNumber of products in this category number
Sample: 42
{{category.image}}categoryproduct-filter.jsCategory banner image url
Sample: https://cdn.commmerce.com/.../indoor-plants.webp

Tips

  • Tokens are case-sensitive — {{category.title}} resolves; {{CATEGORY.TITLE}} does not.
  • Whitespace inside the braces is tolerated: {{ category.title }} works identically.
  • Unresolvable tokens fall through as empty strings rather than rendering the raw placeholder, so missing-data states stay clean.