Product Variants Appearing Twice in Variant Picker After Adding Code for Color Swatches

[JKW25]

Hi,

I added color swatches using code. My products that do not have color as a variant option now show duplicates of my other variant in the variant picker. I have included what it currently looks like. I am not familiar with coding, so I am not sure where to look to get rid of the duplicate variant. 

I did duplicate my theme before adding the color swatches. However, since adding the color swatch code there have been a number of other changes to my store so reverting back completely to an older version is not something I would like to do. 

Thank you!

[EcomGraduates]

You’ll want to go into your theme code and find the file where the swatches were added—usually something like product-form.liquid or main-product.liquid. Inside that file you’ll probably see a loop with something like for option in product.options_with_values.

Right before it starts looping or outputting those swatches, you want to add a check that looks for color only, like this:

{% if option.name == 'Color' %}
{% endif %} 

That way, it only shows the swatches when the option name is actually “Color” and ignores the other options like “Size” or “Allergy.”

[Easify-Jolie]

Hi @JKW25 

If you’re running into issues with duplicate variants after adding color swatches by code, Easify Product Options can help! It lets you create custom product options (like color swatches, buttons, checkbox, dropdown, etc.) without touching any code — and works independently from Shopify’s default variant system, so no more display bugs or theme conflicts. Easy setup, clean design, and no need to mess with your theme! Here's some examples for you:

• Clothing Store:

• Jewelry and Accessories Shop

• Butcher Shop

I hope this answer helps solve the problem. If you need further assistance, feel free to reach out to Easify anytime! 😊