Hi guys,
Currently my option selection on product page such as 'Color" or ‘Material’ is in button format which looks ugly.
How do I change it to drop down menu instead?
Thank you.
Hey, @fangsb !
I’m Helen from Shopify Support. Thanks for your question.
Changing the variant selector is dependant on the theme that you are using on your store. What theme are you using?
Brooklyn is currently the only theme made by Shopify that has a variant picker built-in. Let me show you where it generally lives in the Theme Editor for themes that have the option to change it.
From your Shopify admin, please access go to ‘Online Store > Themes > Customize’. Navigate to a product page and click on Product Page on the left hand side. Within here is where all of your built-in customization options are for the product page.
The variant picker looks like this in the Brooklyn theme:
If you are using a third party theme and unable to find where to change it, please reach out to the developer directly for assistance. Hope this helps!
5 Likes
Hey Helen,
Got it! Thanks a lot!
Hi Helen,
I’m trying to change the radio buttons in Brooklyn to a dropdown menu as well, but wasn’t able to follow these directions.
I lost you at "Navigate to a product page and click on Product Page on the left hand side. Within here is where all of your built-in customization options are for the product page. " When I go to ‘Online Store > Themes > Customize’. , there is no “Product Page”, and cannot find product options form, or any built-in customization. I’ve attached a screenshot of what my left side menu looks like after I follow Online Store > Themes > Customize’…
Please advise on how to change my variants to a drop down menu.
Thanks!
-Heather
1 Like
Hey, @cocorostudios .
Thanks for reaching out. You’re almost there!
The screenshot you have shared above shows that you are in the Theme Editor on the ‘Homepage’. To navigate to a product page, so that you can customize that page, please choose ‘Product pages’, from the dropdown menu at the top of the editor as seen here:
Once you are on the product page, there are sections that now apply to this template on the left hand side. It looks like this:
Clicking on ‘Product pages’ will expand to show all of the customization options for this section, including the option to change your variant drop down menu style.
Hope this helps! Let me know if you need any further clarification.
1 Like
Thank you!! It worked!
1 Like
Hi so I have the supply theme and I’m trying to do the opposite. I would like to change it from a drop down to a radio button and I don’t have an option to change the picker. Is it possible to code something in?
Hi, @mayasplaceny .
Great question!
Changing the drop-down variant option on your Supply theme into “radio buttons” (similar to Brooklyn) requires significant adjustments to the theme code, like rewriting all of the script used on the product page. This would far exceed the 60 minutes of design time that is available, therefore, this customization is not something the Shopify Theme department can support.
However, a Shopify Expert can do this for you! You can hire one directly from within the Experts Marketplace.
Good luck!
Hello!
How do you do the same thing but for the product section of the homepage? There doesn’t seem to be the same options as the product page.
Hello, @Jraw23 !
Are you referring to the Featured Product section on your Home page? What theme are you using?
I’m able to change the radio button on the product page, but when the product is featured on the home page it still has those annoying radio buttons. How can I fix this for the home page as well??
Hi, @ajordan98 .
Great question!
I’m happy to contact our Theme department on your behalf to have them look into it to see if this is something they can customize on your theme for you.
Please keep an eye out for the email I am sending you in order to gather a few more details about your store.
Hello!
I am having the same problem as @ajordan98 . I am using the Brooklyn theme, and I would like to change the radio buttons to a drop down menu when the product is featured on the home page. Could you share this solution with me also?
Hi, @TheresaMB !
I’m happy to have our Theme department take a look to see if they are able to customize this on your store as well. I am sending you an email to facilitate this; Please reply to it at your earliest convenience.
1 Like
Hi, I am facing the same issue, could you help me out as well please!
Hi, @gleko123 !
Thanks for reaching out. We certainly can look into this customization for you as well. I’ll send you an email to get started on it.
Hi there, I’m having the same issue where I would like to replace buttons by dropdown menu in the Featured Product on the Home Page.
Could you please help me on this? Thank you!
Hello, @Blts .
I’d be happy to! Please keep an eye on your inbox for correspondence from me with the next steps.
Thanks,
Helen, I am having trouble finding the options you are referring to in earlier post. These are the only options I have available.
Hey, @paul_bailey !
Thanks for reaching out. Just to confirm, you are using the Brooklyn theme, correct?
If so, then this is most likely due to the version of the theme that is on your store being out of date. Please check which version you are on by going to ‘Online Store > Themes > Customize > Theme settings’. The version of the theme will show here, as seen below:
The most current version of Brooklyn is 16.0.9. Therefore if your version is quite a bit older than this, then you’ll need to upgrade to the newest version, which has the variant picker options on the product pages.
Adding the Brooklyn theme again to your theme library won’t affect your current theme. You can customize the new version to your liking before publishing it to be live on your storefront, and the Brooklyn Help Doc is useful to guide you through all of the up-to-date built-in customization options.
Let me know if this helps, or if you have any further questions.