The Related products section shows other products from your store under the product, as a grid or a carousel. It helps shoppers find more to buy without leaving the page.
Add the section
In the builder, open the Product page or Landing page, click Add new section, and pick Related products from the products group. You can add one per page.
Choose which products show
Set Source mode in the Source group:
- Newest or Oldest: by the date you created the products.
- Best selling: the products sold the most first.
- Discounted: only products that are on sale right now.
- Top rated: the best average rating first. Products without reviews are left out.
- Same collection: only products that share at least one published collection with the product being viewed, newest first. Good when your collections group similar items.
- Picked per product: you choose the exact products for each product, in your own order. Open each product in the product editor and use its Related products part. A product with no picks shows an empty message.
The product being viewed never appears in its own list. Hidden products are left out too.
Layout settings
- Section width: Page or Full.
- Layout: Grid or Carousel.
- Columns: 1 to 8 cards per row on desktop (or cards in view for a carousel).
- Mobile columns: 1 or 2. Carousel on mobile turns the grid into a swipe row on phones.
- Products count: 4, 6, 8, 10, or 12.
- Navigation: for carousels, Navigation icons (Arrows, Chevrons, None) and Icon background (None, Circle, Square).
- Color scheme, Gap between cards, padding, and Custom CSS.
Mobile columns and Carousel on mobile are only offered with the Grid layout. The Navigation settings appear when the layout is Carousel, or when Carousel on mobile is on.
Blocks
- Product card: sets how each product looks (image, title, price, rating, buy button). It is required and cannot go inside a group. Its options are in Product and collection cards.
- Text (up to 2), Divider (1), and Group (1): add a title such as "You may also like" above or below the cards.
Common tasks
- Show matching items: put similar products in the same collection, then use Same collection.
- Sell a matching accessory: use Picked per product and choose the accessory for each product.
- Push your sale: use Discounted.
Troubleshooting
- The section shows a "no products" message: no product matches the source. With Same collection, check that the product is in a published collection with other products. With Picked per product, add picks to that product.
- Top rated shows few products: only products with at least one published review count.
- A product never shows in the list: check that it is published and not hidden.