How can I add color swatches to product pages in the Dawn theme?

[michellelholm]

I am having trouble figuring out how to add color swatches to the product pages. I've read many tutorials and most say to go to theme settings and click "product" on the left side. I don't have that option. I only have "product card" which doesn't mention anything about a swatch. What am I missing? Also, I would ideally like to use a snip from the actual color of the shirt and not just a hex color. Is that an option in Dawn as well without installing an app? Thanks!

[Sweet_Savior_3]

Hello @michellelholm 

Here's how to add color swatches to Shopify's Dawn theme:

1. Go to Shopify admin
2. Click Online Store
3. Click Themes
4. Click Customize the Dawn theme
5. Open the Theme Settings tab
6. Open the Products section
7. Set your product variant style to Swatches
8. Select Show custom swatch images
9. Click Save to apply the change 

Please check the steps and let me know if you still face any issues?

[michellelholm]

That is the process that I followed, but I do not have "products" in that
dropdown. I have "product card" option but that doesn't show the color
swatch option.

[lizziebemis]

I am experiencing this same issue. I've looked in the theme.liquid file and there seems to be no "product" options.  Any thoughts?

[Sweet_Savior_3]

It seems that the update is not available still on the stores. So you need to wait or can go by hard coding it.

[TechSolvo]

You can find a working code for color swatches (dawn V13) here https://youtu.be/95MglAWtQeU. 

[Gotyour]

I have the Dawn 13.0.1 theme. There is no "color swatch" option in the
settings.

[lizziebemis]

Exactly! The functionality has only been released to a limited number of people. They released the documentation BEFORE they released the functionality.

[TechSolvo]

Officially it's not been added to dawn theme yet but you can add by following my above tutorial and code link is also added in description.

[MattBailey]

your answer is literally her exact problem. C'mon man 

[lizziebemis]

I spoke with our Shopify rep this week and I have a bit of info, for anyone coming here and getting frustrated with the lack of answers. This set of features is in beta and there's a list to get early access. However, they haven't actually released it for early access yet and you have to have a Shopify PLUS store. Here's the info on the all the updates: https://www.shopify.com/editions/winter2024

Obviously, this information is subject to change at anytime, once they start releasing to the early access people and to the public at large.  It seems they released the documentation before they released the actual beta. ~rolling eyes emoji~

[Gotyour]

This is disappointing.  The ability to add a color swatch with a circle of color and a hover over name of the color should have already been a part of a product page. The tutorials on Shopify lack basic usability. YouTube does a better job. 

[MRamzan]

You can add color swatches in your product page of DAWN theme.

in this video you will find it. Without using any App.

[TheTeeSis]

thanks

[tim-harding]

Thank you!

[EliskaM]

Hi, I have the same problem. I spoke with Shopify support today and for now this feature is said to be unavailable. There is no known date when it will be available again. If you want, I can send you an article on how to code it - they also sent me directly from Shopify support (I haven't looked at it yet, so I don't know how complicated it is). Plus she also sent me some links to apps - but I assume that you won't want to use another app like me either 🙂
E.

[MRamzan]

Hello Eliska. I already solved it in the video. If you are not able to fix it then you can share me your store link. I will look into it. Or add me staff.

Thanks.

[BridgetBoyer]

Hey there!! I was able to add the swatches to the products, thank you so much! What about adding color swatches to he collection page? 

[uncommonclothco]

I was able to add swatches with the latest DAWN 15 theme.  Swatches can only be used with products that have variants connected to category metafields entries for color. I had to first assign an appropriate category for the shopify metadata fields so you can connect color to the color variants you have in place.  You can click on the little database icon to connect them after you have the category selected.  After this you can set the swatch

Swatch Option Tutorial 

[made4Uo]

I was trying to add the swatch following the instructions here and the color was not connected. Just for other people that encounter this. I was able to resolved it by click the metafield, see image below highlighted in green

[pooshda]

This helped me so much, I found this a couple days ago and I didn't understand exactly what I had to do but I just went back in and tried it again and after defining that category you mentioned (I have nothing in there for my 60'ish shirts so far, but I'm brand new and haven't launched yet) I wasn't wanting to copy/paste someone else's code into my site to enable these but I tried following your post again and it worked great.

Thanks for this!  I have a feeling I need to go through my currently uploaded 60 products now manually since I didn't do it from the start but no biggie probably take 20 minutes now that I'm adding the custom color hex's / names to fill out all my choices.