Products as Variants &/or Several Images per variant.

[joakim-roos]

Hi,

Researching Hydrogen/Oxygen we've found that it's a bit tricky to either have unique urls per product or several images per variant.

The reason for this use-cases is that for lifestyle/fashion brands this is quite important for a good UX.

Looking at https://nour-hammour.com/se-en/products/birthday-coat-black, we see that they use a unique url per variant - but what's the best approach to connect all the different products so you can switch between the colors?

And as mentioned, we're very interested to learn how to add several images per variant. Searching for a solution, we see that many people recommend Easy Variant Images App, albeit this app seems to require a specific amount of images per variant. Also not sure if it works with Hydrogen & the Storefront API.

Any ideas are very welcomed.
Joakim

[nhm1990]

Any solutions here?

[blittle]

By default product variant URLs are technically unique because of the query parameters. But if you want unique URLs without query params, you could maybe hack a solution putting the selected variant/option after the handle? That's pretty messy though. Combined listings are a new early access feature that should give you exactly what you want: https://help.shopify.com/en/manual/products/combined-listings

[nhm1990]

Hey @blittle,

Thank you for the message. The Combined Listings sounds like exactly what I need, however this app is only available for Shopify Plus customers. I will have to look for an alternative then.

The other suggestion is really hacky, but maybe there's no other way. I've read in other discussions that you can possibly come up with a pattern with the alt-text and use it to filter the images in the media library for the product if it's the "color" variant.

Quite awkwardly implemented by Shopify for variant handling.

[jamalsoueidan]

Hi,

Researching Hydrogen/Oxygen we've found that it's a bit tricky to either have unique urls per product or several images per variant.

The reason for this use-cases is that for lifestyle/fashion brands this is quite important for a good UX.

Looking at https://nour-hammour.com/se-en/products/birthday-coat-black, we see that they use a unique url per variant - but what's the best approach to connect all the different products so you can switch between the colors?

And as mentioned, we're very interested to learn how to add several images per variant. Searching for a solution, we see that many people recommend Easy Variant Images App, albeit this app seems to require a specific amount of images per variant. Also not sure if it works with Hydrogen & the Storefront API.

Any ideas are very welcomed. Joakim

Link is broken you provided.