Related products - How to manually select the related products in each product page

Related products - How to manually select the related products in each product page

Where is the Related Products section?

When you browse to Customize Theme > Go to any product page > Section tab > Product page, scroll down to the Related Products section.

What products are displayed by default in the Related products section?

By default, the products displayed in the related products section are from the same collection. For example, some t-shirt products from the T-Shirt collection will be displayed on a t-shirt product from the T-Shirt collection. 

How can I manually select the related products in each product page?

1. Create a menu called Related products

Create a Navigation menu (go to /admin/link_lists/new) called Related products (you can name it differently, but what cannot change is the product handle, it needs to be related-products and nothing else)

Click to see biggerClick to see bigger


2. Add some menu items using the logic product/product-handle

Click to see bigger

You need to always have the word product followed by a / (slash) and by the product-handle (url) of the product where you want to display one or more related products. For example, let's say we have a product called Cool T-Shirt and his product handle is cool-t-shirt.

In this Cool T-Shirt product page, let's say instead of other similar t-shirts from the same collection (by default), we want to display three manual related products: the Cool Hat, the Cool Pants and the Cool Shoes. Here's what it would look like:



Note: You just need to create one navigation menu for all your custom/manual related products in all the product pages.

For all the products without manual related products assigned, the default related products from the same collection will be displayed. 

For the products with manual related products assigned, the "Number of products" limit option is not applying. Only the products selected will be displayed, without any limit.

    • Related Articles

    • Product Page Upsell

      1) HOW DOES IT WORKS? Create a navigation menu called Product upsell. The handle needs to be: product-upsell 2) WHERE IS IT DISPLAYED? In a specific product page: Add a menu item and name it following this structure: products/product-handle And/Or In ...
    • Content tabs in product pages

      You can create tabs inside the product pages. These tabs can be global (for all products), specific to a collection or specific to a product. Create a page and set visibility to visible Create a navigation menu with a handle `product-tabs` Add menu ...
    • Add a video instead of an image in the product page's main images slideshow

      We want to display our video intro in all the product pages right before the main image shows up. The video link is: https://youtu.be/DGGouJ4F_kU Sample product page: https://www.fadstop.com/products/2018-best-selling-adorable-talking-hamster How can ...
    • How to manually insert upsells inside your theme on Shopify

      Grab the snippet to insert it in any theme file: https://tabarnapp.com/manually-insert-upsells-inside-theme-shopify/ Use case example of an upsell in a blog post: https://tabarnapp.com/sell-products-inside-any-page-or-blog-post-on-shopify/
    • Cart page upsell

      1. Create a navigation menu called Cart upsell. The handle needs to be: cart-upsell 2. [Trigger product] Add a menu item and name it following this structure: "products/product-handle". This product will serve as the upsell trigger (the upsold ...