Siblings block setup

Theme Editor -> Product detail page

Feature introduced in Story 3.2.0

The last step in configuring Product Siblings is to add the Siblings block to your Product detail page and connect the metafields created in the earlier steps.

Add Siblings block and position block

In the Theme Editor, navigate to a product page to configure the default product template (Product detail page). If you're using a different product template, change to that template.

  1. Under Product page in the sections column, choose Add block to add the Siblings block.

  2. Move the Siblings block above the Form block:

Under Product page in the sections column, choose Add block to add the Siblings block.

When you move the Siblings block above the Form block, it will line-up nicely below the product title and price and just above any other variant options like size.

Product siblings collection handle

Under the Block options, click on the dynamic source icon for Product siblings collection handle and map to the Siblings collection metafield:

This is will add the Siblings collection metafield:

Product color metafield

Next, add the Cutline metafield to the Product color metafield by using the Insert dynamic source icon:

This is will add the Cutline collection metafield:

Once both metafields have been added, you've completed all the steps required to setup Product Siblings 👏

Check the results

Save the changes and now you can test by viewing one of the products to ensure the Siblings feature is working:

Verify that the image swatches are created and test each one to view the each variant option.

Remember to move the Siblings block up above the Form block in order for the swatches to appear above your other variant options.

Last updated