githubEdit

Display product recommendations

Product recommendations help customers discover more products without leaving the page they are viewing. In Slab, merchants can use recommendation blocks to show either related items or complementary add-ons.

How to set up product recommendations

  1. Open your theme editor and go to a template where you want recommendations to appear (commonly product templates).

  2. Add a container that supports recommendation blocks (for example a grid or slider area in your product content).

  3. Add a Product recommendations block (grid or slider variant).

  4. Set Intent to Related or Complementary.

  5. Set Product if you want a fixed source product; otherwise use the current product context.

  6. Set Item count to control how many products are shown.

  7. Optional: add Filter by tag to narrow recommendations to one tag.

  8. Choose whether to keep Show products in cart enabled.

Complementary recommendations setup

If you choose Complementary intent, configure complementary products in Shopify's Search and Discovery app first. Slab uses that Shopify data when rendering complementary recommendations.

Choose grid or slider recommendations

  • Use a grid layout when you want recommendations to scan quickly in rows.

  • Use a slider layout when you want a horizontal, swipe-friendly row on mobile.

  • Slider recommendations include width controls for mobile and desktop cards.

Suggested defaults for most stores

  • Start with Intent: Related for automatic relevance.

  • Keep Item count around 4 to 6 to avoid visual overload.

  • Keep Show products in cart enabled for cross-sell workflows.

  • Use Filter by tag only when you need tightly curated recommendations.

What each recommendations setting controls

Shared settings (grid and slider)

Setting
What it controls
Options
Default

Intent

Recommendation type from Shopify.

Related, Complementary

Related

Product

Source product used to fetch recommendations.

Product picker

Uses current product context in presets

Item count

Max number of recommendation cards to render.

Number input

5

Filter by tag

Limits results to products containing a specific tag.

Text input

Blank

Show products in cart

Shows or hides recommended products already in the cart.

Enabled, Disabled

Enabled

Visibility

Where the block appears by device.

All, Mobile only, Desktop only

All

Slider-only settings

Setting
What it controls
Range
Default

Width mobile

Width of each recommendation card on mobile.

5% to 100%

80%

Width desktop

Width of each recommendation card on desktop.

5% to 100%

20%

Last updated

Was this helpful?