Color swatches not showing up on product page

Topic summary

A user is experiencing issues with color swatches not displaying properly on their product page despite configuring the settings correctly. The swatches appear as text-based pills instead of visual color indicators.

Configuration attempted:

  • Added colors via meta options with accompanying screenshots
  • Enabled “pill” style in variant picker settings
  • Swatch option name changes don’t reflect on the product page (remains “kleur” in Dutch)

Root cause identified:
The user followed a YouTube tutorial that required adding custom code to theme liquid files. While this enabled basic color swatch settings to appear, the implementation appears incomplete or contains errors preventing proper display.

Proposed solutions:

  • One responder offered to review the theme code directly
  • Another suggested using the Easify Product Options app, which provides a no-code solution with free color swatch functionality

Current status:
The issue remains unresolved. The user is open to code-level assistance to fix the custom implementation.

Summarized with AI on November 2. AI used: claude-sonnet-4-5-20250929.

I have added colors to my product with the meta option.

I have all the settings as they should be:

I also have “pill” enabled in the variant picker options

But still, the color swatches are not showing up. They are pills with just text.

I have no idea why… Also if I change the “swatch option name” to anything else, nothing happens on the product page, it still keeps saying “kleur”, even if I change the swatch option name it keeps saying “kleur” (= color in dutch)

Can anyone help me with this?

Hello,

We need to check the code of the theme for resolve this issue.

If you want to help in urgency then please message to us we will get back to you ASAP.

Thank you

Hi @oihanevr

It sounds like you’ve set up your color swatches correctly, but there might be a minor issue causing them not to display as expected. I recommend trying Easify Product Options, a user-friendly app that allows you to create and display custom color swatches effortlessly. Plus, the color swatch feature is completely free to use. Here’s how it can help you:

  • This is the result

  • This is the app setting

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

Hello,

I did follow a youtube tutorial on how to add color swatches.

https://youtu.be/AkFU2IY3-j4?si=AnOJfWQpQIAF-NgO
It tells you to add codes to some liquids in the theme code.

Before I followed this tutorial, i didn’t even have the “color swatches" settings at all, I had nothing. So small progress in getting to the desired result… But indeed maybe something in the code might still be incorrect.

How would you like to help with my code?