Related Products

A heading and a carousel of product cards. On product pages it shows Shopify’s automatic recommendations for the product being viewed; anywhere else it shows the products you pick by hand.

The two aren’t alternatives you choose between — they work together. Your hand-picked list is what renders first, and Shopify’s recommendations replace it a moment later once they load. If Shopify has no recommendations for that product, your picks simply stay. The carousel is never empty.

Used on the product template.

Settings

Setting	What it does
Use related products	On by default. Swaps in Shopify’s automatic recommendations on product pages. Turn it off to always show your hand-picked list.
Product list	Up to 8 products, picked by hand. Shown until the recommendations load, and kept if there are none for this product.
Top / bottom padding (mobile)	0–10 rem, default 2.5 rem each.
Top / bottom padding (tablet)	0–10 rem, default 4.5 rem each.
Top / bottom padding (desktop)	0–10 rem, default 7 rem each.

That’s the whole section. There’s no column count, no card style and no “view all” — the carousel handles its own responsive layout.

Blocks

The section has one fixed block that’s always present and can’t be removed:

• Title — the heading above the carousel.

There are no other blocks. The cards come from the product list or from Shopify’s recommendations.

How the two sources interact

Where the section sits	Use related products	What visitors see
Product page	On (default)	Your product list first, replaced by Shopify’s recommendations once they load. Your list stays if there are none.
Product page	Off	Your product list only.
Any other page	Either	Your product list only — there are no recommendations to fetch outside a product page.

On a non-product page, an empty Product list means an empty section

The recommendations only exist on product pages. Put this section on a homepage or a content page and leave the Product list blank, and nothing renders. Fill in the Product list for any placement outside the product template.

The list isn’t a second-class option

It’s tempting to leave the Product list empty on the product page because Shopify will fill it. Don’t. It’s what’s on screen for the first moment of the page load, and it’s the safety net for products Shopify hasn’t got recommendations for yet — typically new products, which are exactly the ones you want cross-sold.

Carousel behaviour

The carousel shows one card at a time on phones, two from 640px, three from 768px and four from 1212px. It loops, and arrows appear when there are more cards than fit.

You can’t change any of that from the customizer — it’s fixed so recommendation rows look identical on every product page.

Tips

• Always fill in the Product list, even on product pages where recommendations will take over. It’s the fallback and the first paint.
• Four picks is the sweet spot. Desktop shows four at a time, so four fills the row with no arrows. The limit is 8.
• Turn off “Use related products” to pin a specific set. If a product needs a deliberate cross-sell — a companion formula rather than whatever Shopify infers — that switch is how you take manual control.
• Recommendations improve over time. Shopify builds them from real order and browsing data, so a newly launched store will lean on your fallback list far more than an established one. Revisit the picks later.