Can't display custom metafield images on color variants for my products

My color variants are only showing standard color swatches and not the images I’ve uploaded to the color metafield. I’ve tried trouble shooting but can’t seem to figure out why I can’t get them to display in the color variant swatch menu on my products. Please help!

Hi @mrs_mccann

This usually happens because the theme isn’t connected to your color metafield it’s still pulling default variant colors instead of your uploaded images.

Check these first:

Theme Settings → Swatches / Variant Picker
Make sure it’s set to use custom swatches or metafields, not standard color.
Settings Custom Data Variants
Confirm your color metafield is

Type: File / Image
Assigned to Variantsnot Products
Open your theme editor Product template
Make sure the variant picker block supports image swatches (some themes require enabling this manually).

If your theme doesn’t support metafield-based swatches, you may need:

Custom Liquid code
Or a swatch app

Most of the time it’s just the theme not mapped to the metafield

Hi @mrs_mccann

You need to add the image on the product page using the product metafields.

Best regards,
Devcoder :laptop:

It looks like your theme uses the old way for swatches and not the new, metafield-based:
https://help.outofthesandbox.com/hc/en-us/articles/360024080613-Flex-Swatch-settings

Since they sell Flex from their own site, not in Shopify app store they do not have to follow the new standards.

You may try to contact their support though to confirm.

Just in case – new way of adding swatches – https://help.shopify.com/en/manual/custom-data/metafields/category-metafields/using-category-metafields (in case they do support this, you may wish to confirm that you did it properly).

Hi,

Hope this will help

  • Confirm the theme actually supports metafield swatches
  • Double check metafield definition
  • Verify the option name matches theme logic
  • Check if theme is overriding swatches with its own system
  • Clear cache and test on a fresh product

Hi @mrs_mccann :raising_hands:

It sounds like the images you’ve uploaded aren’t appearing in the color swatches as expected. In some cases, this can depend on how your theme or store configuration handles color option displays.

Another approach you might consider is using Easify Product Options.:blush:

  • This is the result:

  • This is the app setting:

With the app, you can simply create a Color Option, choose the Image Swatches display type, and upload the corresponding image for each color you’d like to show.

One thing I really like about this approach is that you don’t have to rely on additional theme configurations. Everything can be managed directly within the app, making the setup process much simpler and easier to maintain when you need to add new colors or update existing swatch images in the future.

If your goal is to display custom images instead of Shopify’s default color circles, this could be a simple and practical solution worth exploring. :heart:

If you are relying purely on Shopify’s native theme settings to pull from your color metafield, the issue is almost always a missing connection in your theme customizer.

You can easily set up a premium, interactive product page layout using the Misk Variant Product Options app. This allows you to replace boring dropdown menus with clean, clickable visual elements that look beautiful on both desktop and mobile layouts.

  • Display Your Sizes as Clean Buttons
  • Add Visual Image Swatches for Colors
  • Embed an Interactive Size Guide Link

Hey @mrs_mccann .I hope you are doing great.
This is very common issue every person should face,

Try these quick fixes

Check your option names.
Go to your online store & set it to swatch.
Resave your meta fields under settings .
Also you need to assign images to the variants not just to the product gallery.

I hope this will help you to resolve your color & colour settings.
If you need any help feel free to ask me..

Hi,

If your color variants are only showing standard color swatches and not the uploaded images, you can try setting up the color selection using the Product Option feature in the Inkybay – Product Personalizer app.

With Inkybay, you can create image swatches or color swatches for your product options and display the actual images instead of basic color circles. Customers can visually select the option they want, and you can assign each swatch with the correct image, color, or design. This makes it easier for customers to understand exactly what they are selecting before adding the product to the cart.

Inkybay also supports other option types like dropdowns, radio buttons, checkboxes, text fields, and file uploads, along with extra pricing for specific options if needed. All selected options are automatically included in the order details.

The setup is simple, no coding is required, and Inkybay offers a 21-day free trial so you can explore the features and see how it works for your products.