How to setup Product Siblings?
Product Siblings is the ability to link directly to other products as product swatches. The result is a rich product detail page that includes swatches with images that represent each variant option.
When you view a siblings product, only the images associated with that variant option, plus product details, and prices for the variant are shown:
Setup Steps:
There are five main components to setting up product siblings:
- Creating individual products. Each product can have variants like sizes.
- Group the sibling products into a collection. This collection does not have to be displayed on your storefront.
- Define two custom metafields to link each product together which will automatically create linked product swatches.
- Update the metafield information for each product.
- Add the Siblings block to the Product template in the Theme Editor.
Create individual products
Each sibling is an individual product. Using custom metafields, the theme will connect these products together and auto-generate the swatch images using their preview images or swatch options inside theme settings.
Example of individual products in product admin:
In this example, we will combine all these products into one product using the Siblings feature.
Therefore, each product is a duplicate of the other with the exception of the color in the title and the product images.
Each product represents one color for the combined product.
Create a collection containing siblings
After creating the products, place them all in one collection. The collection does not need to be used for any other purpose (can be hidden from your storefront):
Create a Metafield for Sibling Collection
Use the metafields editor under Settings in the Shopify Admin > Settings > Custom Data > Products
Name your metafield theme.siblings
, which will be used to select the collection. The content type is: Single line text and One value.
Please ensure you change the Namespace and key to
theme.siblings
By default, the namespace begins withcustom
. This will need to be changed totheme
.
Create a Metafield for Sibling Colors
Use the metafields editor under Settings in the Shopify Admin > Settings > Custom Data > Products
Name your metafield theme.sibling_color
, which will be used to select the collection. The content type is: Single line text and One value.
Please ensure you change the Namespace and key to
theme.sibling_color
By default, the namespace begins withcustom
. This will need to be changed totheme
.
Setup Sibling Products
After creating the metafields in the previous steps, we complete the setup in the Product Admin. Add the associating information to each of the newly created metafields for each product.
Sibling color
This value is to identify the swatch (color) and label-name of the swatch.
A nice advantage when using Siblings is the ability to create descriptive names for each swatch.
You’re not limited to basic color names.
Siblings
This metafield is used to map each product to the correct collection they belong to. Each group of products should have already been added to a collection.
For example, each product sibling for the product “Jackie T-Shirt” belongs to a collection with the handle of sibling-jackie-t-shirt
.
Add Siblings block to your Product Information section.
After creating the metafields and adding values to each of your products, the final step is to add the Siblings block to your Product template under the Product information section:
Select metafields inside block settings:
Changing the Color label
Product siblings by default are used to replace the color variant by grouping similar products and generating custom swatches for each color option.
If you would like to change the Siblings feature to replace to be used with other variant types instead, you can apply a global change to accommodate that.
In the above example, if your store is selling are artwork and would rather replace the Color label with Styles:
Go to Edit Default Theme Content:
Change the value under Products. You can also search for “siblings” to find it quicker:
When changing the Siblings Label value in the default theme content, the change becomes global. The Siblings feature will always show the new value (“Style”) for any Siblings products you build on your store.
You can still use regular Swatches for other products and display “Color” as a label for those. However, any Siblings products will have the new value “Style” from our example.