Change Variant dropdown menu to radio buttons in Supply theme

Store Design
1

We have 2 size options on 95% of our products. Would like to show the 2 variants as radio buttons instead of drop downs. How would we go about doing this?

New to Shopify so my “liquid” knowledge is not so good.

Thank You!!!

1 Like
2

@John_CCW

can you please try this

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

if need any help let me know

3

Hey @John_CCW .

Thanks for reaching out.

Could you let us know which theme you are using? If you are unsure about which theme is live on your store, you can navigate to the Theme Editor and select the three dots to see who the theme is designed and supported by. I took a screenshot from my test store to show you the section I am referring to:

15-12-95428-51555
15-12-95428-51555568×504 147 KB

Once we determine which theme you are using on the online store, we can then look to provide the next best steps to have the variant options appear as mentioned above.

Looking forward to your reply.

4

Using the Supply Theme on classiccarwiring.com

1 Like
5

@John_CCW

thanks

if you have able to code try above guide if any issue let me know

6

Hey @John_CCW .

Thanks for providing the theme and URL to the store as that is super helpful!

Looking into the link you have provided, by default the Supply theme will create a drop down menu for the variant options that have been added to a product. Since the Supply theme is designed and supported by Shopify, we can use free design time for Shopify themes to allow our internal themes team to make changes on your behalf.

With that being said, if you are interested in using the design time, we will need you to login to your store using our Contact Us page. This will allow us to securely verify you as the store owner before discussing the changes with a Support Advisor.

Let me know if you have any questions.

7

I used Ketan’s solution and was able to implement it on Supply Theme.

1 Like
8

@John_CCW

thanks for update

9

Trying to change the variant drop downs to radio buttons as well. Link above says no longer viable. Anybody have a solution for this?

10

This link does say “not viable” but it worked for us less then a month ago. Read through it all the way, a few other users added some very important points. We use the “Supply” theme, it may not work on others though.

11

F0056C6B-EDA1-4C90-B05E-E47AE2828E4E.jpeg
F0056C6B-EDA1-4C90-B05E-E47AE2828E4E.jpeg320×240 10.6 KB

B0920414-9D91-4D8E-98D9-6FE1E0AF160C.jpeg
B0920414-9D91-4D8E-98D9-6FE1E0AF160C.jpeg320×240 10.2 KB

1 Like
12

@John_CCW

Sorry you are facing this issue, it would be my pleasure to help you.

Welcome to the Shopify community! :blush:
Thanks for your good question.

Please share your site URL,
I will check out the issue and provide you a solution here.

13

Thanks KetanKumar

I’m good, just showing the example to an above user that’s looking to set up the buttons instead of dropdowns.

You helped me with this awhile ago :slightly_smiling_face:

14

@John_CCW

can you please check your theme setting may allow this option change radio to dropdown

15

Hi Ketan,

I am facing the same issue. I want to change the dropdown to be a radio button.

I used the link you provided but I am unable to find the “selectCallback” function in any of the files listed. I even went through others looking for them.

I am using Supply theme.

16

THe linked article is “archived,” so it cannot be read. Amazing.. Can you put the actual solution in this thread?

thanks