The ‘Linked products’ block can be added to the product form which allows you to connect separate products as if they were product variants; Allowing you to manage your inventory per product but showcase them on each others product page.
An example of this is if you have a T-Shirt in 5 different colors you can set these 5 T-Shirts up as separate products, so they all display in your Collection pages, and also showcase them to look like a color variants on each product.
This means your customer can see all their options on both the collection and product page increasing the chance of conversion.
Step 1: Add all your variant options as separate products
Within your Shopify admin, go to Products and add the products you wish to see displayed on the collection pages and within the product form.
E.g. Tshirt - Red, TShirt - Blue, TShirt - Green
Step 2: Define a metafield for your Linked products
To specify which product is related to each other we need to create a metafield ‘List of products’. By using a metafield, you will be able to link different products together, depending on their relevance to one another.
- Within your Shopify admin, go to Settings.
- Go to Custom data.
- Select Products and click Add definition.
- Provide a name and key for your metafield. These can be anything you like. For example ‘linked products’ ‘colourways’, ‘alternative sizes’ or ‘separate variants’. It will only be visible in your admin.
- From the content type select Product and List of Products
- Save
Step 3: Assign metafields to your products
You can now assign your metafields to your products.
- Within your Shopify settings, go to Products.
- Select the relevant product.
- Scroll down to the metafield option and select the metafield you defined above. In our case ‘linked products’.
- From here, you can select the products that you want to be displayed in the Linked products block that will look like product variants.
Step 4: Set up Linked products on your store
Next, you can set up the Linked product block on your product page.
- Within the theme editor, navigate to your product page.
- Add a Linked products block to the product form.
- Click the stacked circle icon to choose the metafield you set up, selecting the metafield you created for your list of products.
Note: You can also use a metafield for the label if you want to change the title on a product basis instead of a template basis.
Things to note
- The product’s first image is used for the swatch
- If a product doesn’t have any images - then the product title will be shown
- If a product doesn’t have any images, the tooltip won’t show as this would simply repeat the text in the swatch
- If a product title contains a ‘-’ then the tooltip will only show the text after this, eg. the product above will have a tooltip that simple says ‘canton’
- Out of stock products won’t show