Related Products
A row of product cards — horizontal scroll on mobile, four-column grid on
desktop — that shows products related to the one being viewed. By default it
uses Shopify’s Recommendations API, which returns algorithmically chosen
products. To override with a hand-picked list, populate the product’s
nama.product_related_products metafield (a list of product references).
When neither the metafield nor the Recommendations API has data on first render, a client-side fetch fires to load recommendations asynchronously and replace the section in place. Alpine is re-initialised on the injected markup so quick-add modals and other interactive features keep working.
Settings
Section titled “Settings”| Setting | What it does |
|---|---|
| Section ID | Optional anchor for jump links. |
| Product limit | Maximum number of cards to show (2–12, default 4). |
| Full width header | When checked, the header spans the full container instead of being constrained to 768px. |
| Center align header | Centres the heading and any blocks above the grid. |
| Show product description | Toggles the short description on each product card. |
| Hide variant selectors | Hides variant pills on the product cards (default on). |
| Padding top / bottom | Default 48/64/80px each. |
Blocks
Section titled “Blocks”Repeatable (header area):
- Title — section heading above the product grid.
- Rich text — description or intro copy.
- Tag — a pill label above or below the title.
- Custom HTML — freeform markup in the header area.
All header blocks render inside the constrained header wrapper (unless Full width header is checked).
Where it’s used
Section titled “Where it’s used”- Product templates (all three: default, parts, mid-tier)
- Use the metafield for flagship products. Hand-picked related products convert better than algorithmic ones — especially for upsells and cross-sells within the same product line.
- Leave the metafield empty for long-tail products. The Recommendations API does a reasonable job for accessories and parts where manual curation isn’t worth the effort.
- Keep the limit at four. The grid is four columns on desktop; going higher creates a second row that’s easy to miss.
- Hide variant selectors unless your related products genuinely differ by variant. Colour pills on a row of identical juicers add noise without value.