How to use the alternate products modification
This is a guide to explain how to set up your alternate products modification.
This service uses product metafields to join different products together so they appear as one, yet remain separate on the collection page and in the filters. This allows each product/variant to have multiple pictures of only that product/variant, yet retains swatches, giving the impression that it is one cohesive product. This can be used for other variants, not just colors, but the process is the same.
After we have built this for you, we will typically have set up one set of products as an example.
Here is how you can set up your remaining ones.
Let us pretend that you have a shirt in 3 colors: red, blue, and yellow. You have created three separate products for these with multiple images in each.
We will have created a new product list metafield for you called something like "alternate colors," in which you will click to have the product picker pop up:
Once you click "Select products," you can search for the products you are linking to. Make sure to select the current product as well, this way it can show as the current swatch like a product with true variants.
Click Add and you'll see your list, making sure that your current product is the first one. In this case, we're on the Blue Shirt, so the Blue shirt product is the first in the list.
You then repeat this process for the other "variants."
On your product page template where you have the new Product List block enabled, this is linked to your alternate colors metafield, and will output the product you have added so they appear as swatches:
On click to another swatch, you're brought to that other product with its own multiple images:
These show as different products in the collection page as well:
You then follow these steps for your other products.