Adding colour and size variants

Store Design

Topic summary

Main issue: A merchant wants color swatches on a product page to open the specific color’s product page, while also offering size options (XS–XL). They’re using the Pipeline theme and have set colors and sizes as variants, but clicking a swatch does not navigate.

Key clarification:

  • In Shopify, a “variant” (e.g., color, size) changes the selected option on the same product page; it does not navigate to another page.
  • “Swatches” are UI elements that select a variant, not links by default.

Suggested approach:

  • If navigation to separate pages per color is required, set each color as its own product, then link those products together via color swatches/pills/dropdowns that act as links.
  • A tutorial video was provided: https://www.youtube.com/watch?v=lSDlOLozdUQ

Notes:

  • An image was included but the behavior described is standard Shopify behavior across themes.

Status/outcome: No final resolution yet. Next step is to decide between keeping color as a variant (no navigation) or splitting colors into separate products and linking them via swatches.

Summarized with AI on December 20. AI used: gpt-5.
1

Hi! I’m really in need of some help.

I want to add colours and sizes to my product.. and I want the color swatch to go to the page of that product when I click on it.

My t shirts come in 4 colours (black, blush, ash, and ivory) and come in 5 sizes (xs, s, m, l ,xl). I’ve added the colour variations and sizes but I want shopify to know that the t-shirt is one product… with multiple sizes and colours.

When click on the colour swatches it doesn’t take me to the page of that product. My theme is pipeline.

I hope that makes sense. Can anyone help?

Screen Shot 2024-09-04 at 1.04.17 PM.png
Screen Shot 2024-09-04 at 1.04.17 PM.png2874×1424 238 KB

2

Hi @iceymonski ,

If you have added the color as variant this will not take you to any other pages but select the appropriate variant.

Please refer to the below video where you can list all different color products separately and link them via color swatch, pills or dropdown.

Let me know if I understood it correct.