Update to color selector variant for products

Topic summary

A user wants to replace the standard dropdown color selector in their Shopify Simple theme with visual color swatches that display all available variants as clickable images.

Current Status:

  • The user tested and installed the “Variants Options, Color Swatch” app, which worked well during the 30-day trial period
  • They were hesitant to invest in paid apps initially due to low sales on their stores (illsockgame.com and fresh4him.com)

Solutions Discussed:

  • Apps recommended: Variants Options/Color Swatch, Advanced Product Options (both offer free trials but require paid plans)
  • Free alternative: VARIANT OPTION PRODUCT OPTIONS app was later suggested by another user, which offers color/image swatches without cost unless price add-ons are needed
  • Custom coding: An obsolete Shopify tutorial exists but requires advanced coding skills
  • Theme change: Dawn theme was identified as having closer built-in functionality
  • Design support: Users on paid Shopify plans qualify for 60 minutes of free design time from the themes team for customizations

Additional Questions:

  • One user asked about displaying multiple selectors (one for regular colors, another for limited edition colors)
  • A YouTube tutorial link was shared as a potential coding solution
Summarized with AI on November 5. AI used: claude-sonnet-4-5-20250929.

Hello,

I am using the Simple theme for my e-commerce site (https://illsockgame.com/). For the product variants color selector the theme uses a standard drop-down menu. But I’d like to instead use something that shows all of the colors, with the user being able to select a variant based on an image. Is there a way to change this in settings, or can I use some custom code to make this update? Or would this require a theme change (hoping not to do that though). Thanks for help with this!

CURRENT:

WHAT I WANT:

Always backup themes before making changes

This is an advanced theme customization.

The crude recommendation is to use an app.

If you have coding experience shopify has an OBSOLETE tutorial to use as an UNFINISHED jumping off point:

https://community.shopify.com/c/shopify-design/product-pages-add-color-swatches-to-products/m-p/616427

Otherwise consider finding a theme with the functionality you need baked in.

If you need the customization done for you contact me at paull.newton+shopifyforums@gmail.com please provide context in your email: store url, theme name, problem description or link to relevant posts.

Hi there, @MikeLewisDigita !

Welcome to the Community! Definitely a great place to gather some input regarding anything about the platform! We have a great group of contributors who are always willing to provide their own expertise and experience with regards to Shopify!

With regards to what you are after, you can definitely find some coding solution about this and I look forward to seeing what other contributors who are more well-versed in this to do so. However, you can also use an app to achieve this in your own store. Feel free to checkout the following apps I found that will help you in this:

  • Variants Options, Color Swatch: this a highly rated app with a free plan that allows you to present your color swatches in the image you presented above.
  • Advanced Product Options: another highly rated app with a free plan that will allow you what you want for your varianta.
  • Color Swatches, Variant Option: this is a fairly new but highly rated app that will also allow you to achieve what you are after; does include a free trial but not a free plan.

Definitely let us know how these work out for you!

2 Likes

Thanks Daniel for the warm welcome and getting back to me. I downloaded both the Variants Options, Color Swatch and Advanced Product Options apps. Both of them look to be pretty nice options. However, neither one appears to have a free option. Advanced Product Options appears to have a 15 day free trial, while Variants Options, Color Swatch appears to have a 30-day free trial. Because I’m still waiting to get sales to both of my Shopify sites (https://illsockgame.com/) and (https://freshties4him.com/),,) I’m a little reluctant to invest in either solution at this time. But I may revisit once sales pick up. If I try one of the apps, I’ll make sure to come back and let you know how it worked and if I subscribed.

Thanks again for getting back to me!

Thanks Daniel for the reply. Thanks for the code link, but I’m afraid I’d break something if I tried it! :scream:

I would like to explore the option of changing themes you suggested. Upon closer review of the Shopify Free Themes the Dawn theme has something close to what I’m looking for:https://themes.shopify.com/collections/free-themes . If that still doesn’t work and I decide to go the customization route, I may circle back to you for help.

Thanks!

My pleasure!

Since you are possibly using a Shopify-made theme, you can also try to forward this request to our live support team. If you are already on a paid plan, you qualify for 60 minutes of design time from our themes team. Check out this link for more information about that.

I can’t guarantee that this is a customization that they can provide but it’s always worth the ask! Also, if there are other things that you want but are having trouble to achieve within the editor you can also forward those request to them and our live support team will see if this is something that we can help you out with!

All the best and please keep using the Community at your disposal! Lots of great information and even better help on here.

1 Like

Thanks Daniel, I’ll definitely take you up on the offer to use the 60 minutes of Shopify design time with the themes team.

Have a great weekend!

MikeLewisDigita

my shopify sites:

https://illsockgame.com/

https://freshties4him.com/

I installed the Variants Options, Color Swatch and trying it out for the next 30 days.

So far, so good!

Hey, Mike!

So great to hear you’re liking the app so far!

As for the 60 minutes design time, feel free to reach out to our live support team once you have anything on your end that you may want some help with and they will forward these requests to our themes team for approval.

All the best to you friend! Happy selling!

Hi @Daniel_41 thanks for the info about the 60 minutes of design time. I used the link but couldn’t figure out how to sign up for the design time with the themes team. I have a couple of customizations to my theme that I’d like to request, but wasn’t sure how to do so after I’m logged in. Let me know… thanks again!

I am so happy to have been able to assist here!

The link I provided should give you that information behind this benefit of using a Shopify-made theme but once you are ready to forward your customization requests, you can simply reach out to our live support team. You can then inform them that you are wanting to use your 60 minutes of design time. They will listen to your requests then push it forward to our Themes team if it is something that we can help you out with.

The link in my previous response will lead you to their queues. Definitely let me know if you need any further help regarding this matter. Happy designing!

Hello Mike, did you ever find a solution that works for you? I came across this post while searching for a solution to a problem I have and figured I’d share. There is a FREE app that lets you use color and image swatches, VARIANT OPTION PRODUCT OPTIONS.

You can view how I set it up on my test product here, this was done just yesterday. This is FREE but to have options like price add-ons, you would need the paid version. If you don’t need price add-ons, this would work great.

How would I be able to have one selector displaying color and another displaying limited edition colors?

You can try this solutions:

1 Like