Liking alternative colours of products

[shinyakoizumi]

I want to set up individual product listing for each colour but not sure how to show customers the other colours you have of that product.

I have seen this blog post using product tag to do but it seems not easy manage and if I want to group products and show as one product with color swatch in the collection page then

it will take time to render because you need to look for tags in each product. Is there any other way to do or best approach is to develop custom app to do it? Ultimately I want to set up the product

like this https://stephenkeable.medium.com/linking-alternative-colours-of-products-together-in-shopify-b0ad3c4...

[JoesIdeas]

I've done this using JavaScript and the Shopify ajax API.

The system I usually use:

1) Create a consistent url format

2) Use JS to get the url of the page, then swap in the other variants into new urls to fetch the product images / data

3) Now you have the product data and can show images, link to the product, have an add to cart button for that product (like if you want to let them add it right there).

[shinyakoizumi]

Thanks for the quick answer.

Can you give me an example for "consistent url format"? How did you make the relationship between current product and other product(the same product but different color)

[JoesIdeas]

Ya so for example:

site.com/blue-jacket
site.com/red-jacket

Then on the product page (with JS) grab the url and swap out the part before the -, or swap out blue / red however you want to in the code and then pull in the product info via ajax and the product handle... or just build the urls for the related products.

Or you faster way if you're just looking to generate urls:

{% assign new_handle = product.handle | replace: "blue-jacket", "red-jacket" %}

If you're wanting to show multiple related products you could put something like that in a loop.

[shinyakoizumi]

How do you want to set up so what other colors current product has when each product has the different color? meta field? tags? settings_data?

I know this artcile suggest to use product tag but I am curous if there if better option.

https://stephenkeable.medium.com/linking-alternative-colours-of-products-together-in-shopify-b0ad3c4...

Thanks,

Shinya