Color Swatch Missing - Code Issue in Warehouse

Solved
dragman
Tourist
7 2 1

For my product page, one of the color variant swatches is missing (dark grey heather). The custom swatch has been uploaded in the assets page of the edit code section and all the other uploaded swatches work with no issue. When I go to the page itself and inspect the code I can see the issue, but I don't know where to fix it in the 'Edit Code' section
01.png

02.png

Code Issue: 

For example, when looking at the color swatch code in the Inspect section for the Heather Clay color the code goes

<label class="" for="" data-bg=" This is the link for the color " title="Heather Clay" style="">...</label>

  
The color swatch code in the inspect section for the Dark Grey Heather color code goes

<label class="" for="" style="background-color:darkgreyheather"" title="Heather Clay">...</label>


While there is a link in the Heather Clay (data-bg="") for the Dark Grey Heather it only says 'style' with no link. I don't know where to edit this in the actual theme code

0 Likes
iDoThemes
Pathfinder
90 19 35

Looking at the warehouse code:

Vision Control ~ Edit ~ Warehouse ~ Shopify 2021-08-04 15-57-08.png

It looks like if color_swatch_image isn't blank it will output and image, else the background-color style. This means for some reason color_swatch_image is blank for you at this stage in the loop, you can probably do some logging out of the data here to see what's going on, my guess would be some issue with case/spaces/handleization

Developer of Liquify Chrome Extension -- Enhance the Shopify Theme Code Editor

Theme Developer -- Drop me a line
dragman
Tourist
7 2 1

Thank you for the reply! My code line looks identical to what you're showing. Do you know where I would be able to find the code specific to the Dark Grey Heather to see what is going on over there? I'm not sure what section to look in under Edit Code

Also, I don't know if this helps, but I added a new product with different color options - the new options being Navy, True Royal, Leaf, and Athletic Heather. I added my custom swatches to the assets just like all the other ones and with the correct names but they aren't working either

Untitled.pngCapture.PNG

0 Likes
dragman
Tourist
7 2 1

02.png

0 Likes
dragman
Tourist
7 2 1

This is an accepted solution.

Solution Found:

I had uploaded the original swatches to both my files and assets, but I had the Dark Heather Grey named incorrectly in my files. The new swatches were never uploaded to my files. Now that they have been uploaded to both locations the product page swatches are working correctly. If anyone else has a question regarding this same issue please reach out if you don't understand my solution!

Thank you very much for your help IDoThemes!