What's your biggest current challenge? Have your say in Community Polls along the right column.

Why aren't my product color variants displaying on my website?

Solved

Why aren't my product color variants displaying on my website?

TheResinator
Tourist
5 0 1

I've input my variant which is colour but when I add the variants and add pictures, hit save and go to my website the variant isn't showing up. 

 

https://theresinator.com.au/products/t-rex-dangles

 

Theme - Craft 

Accepted Solution (1)

Erin
Shopify Staff (Retired)
1116 137 182

This is an accepted solution.

Hi there @TheResinator.

 

I've taken a look and it appears that the theme Craft does not have the "variant picker" block included in the product page template by default. This means that without adding the variant picker manually, your customers won't see variant options on the storefront.

 

You can add the variant picker block by going to Online store > Themes in your Shopify Admin and clicking Customize next to the theme you are working with. Once in your theme editor make sure you are editing your Default product page and then you can add the Variant picker block into the Product information section. 

 

You can see an example of what this setting looks here:

06-18-87497-86938

 

This will allow your variants to be displayed and selected on your storefront as long as you are adding variants to your products correctly.

 

For reference, you can find the steps to add variants to your products on this page here. You can also read more about using sections and blocks within your theme editor on this page here.

 

Please let me know if you try that out and are still having trouble with it. I'd be happy to troubleshoot this further if you need it.

Erin | Shopify 
 - Was my reply helpful? Click Like to let me know! 
 - Was your question answered? Mark it as an Accepted Solution
 - To learn more visit the Shopify Help Center or the Shopify Blog

View solution in original post

Replies 25 (25)

Erin
Shopify Staff (Retired)
1116 137 182

This is an accepted solution.

Hi there @TheResinator.

 

I've taken a look and it appears that the theme Craft does not have the "variant picker" block included in the product page template by default. This means that without adding the variant picker manually, your customers won't see variant options on the storefront.

 

You can add the variant picker block by going to Online store > Themes in your Shopify Admin and clicking Customize next to the theme you are working with. Once in your theme editor make sure you are editing your Default product page and then you can add the Variant picker block into the Product information section. 

 

You can see an example of what this setting looks here:

06-18-87497-86938

 

This will allow your variants to be displayed and selected on your storefront as long as you are adding variants to your products correctly.

 

For reference, you can find the steps to add variants to your products on this page here. You can also read more about using sections and blocks within your theme editor on this page here.

 

Please let me know if you try that out and are still having trouble with it. I'd be happy to troubleshoot this further if you need it.

Erin | Shopify 
 - Was my reply helpful? Click Like to let me know! 
 - Was your question answered? Mark it as an Accepted Solution
 - To learn more visit the Shopify Help Center or the Shopify Blog

TheResinator
Tourist
5 0 1

Screenshot_20220308-211130_Chrome.jpg

I don't have that product description section on my theme 

Erin
Shopify Staff (Retired)
1116 137 182

Hi @TheResinator 

 

Thank you for that screenshot! It looks like you are currently editing your Home page. In order to edit your product page you will want to switch the template you are editing to your Default product page template. You can do this by clicking the dropdown menu at the top of the page in your theme editor. Then you will want to select Product > Default product and the Product information section will appear on the left. I've included an example below of what this will look like if you are using the theme, Craft.

 

08-46-77963-84185

 

You can also read more about using the theme editor on this page here.

 

Don't hesitate to reply back if you are still having trouble adding the variant picker.

Erin | Shopify 
 - Was my reply helpful? Click Like to let me know! 
 - Was your question answered? Mark it as an Accepted Solution
 - To learn more visit the Shopify Help Center or the Shopify Blog

Ivanamaree
Visitor
1 0 1

Hi Erin,

I am having the same issue. My variants used to show up and now they are not. When I go into the customise section of the products there is no variant picker option available…

Erin
Shopify Staff (Retired)
1116 137 182

Hi there @Ivanamaree. I can definitely troubleshoot this with you! I just have a few questions to make sure I fully understand your situation.

  • Did you add your variants by following this guide here
  • When did you notice that your variants weren't showing up anymore? Did you make any changes to your theme or variants before you noticed this?
  • Which theme are you currently using?
  • When you say the "customize section of the products" are you referring to the page that comes up when you go to Products in your Shopify Admin and click a specific product? Or do you mean the product page template in your theme editor? I've included examples of the two pages I'm speaking about below.

28-49-36067-69869

 

28-52-14171-38678

 

I look forward to hearing back from you! Once I have more information I'll be able to share more next steps with you.

Erin | Shopify 
 - Was my reply helpful? Click Like to let me know! 
 - Was your question answered? Mark it as an Accepted Solution
 - To learn more visit the Shopify Help Center or the Shopify Blog

lacysaunders
Visitor
1 0 0

Hi, Erin. 

I went to Online Store > Themes > Customize > Products > Default Product and added the "Variant Picker" block in "Dropdown" option.  

When I now go to Admin > Product with the intent to select one of my products and add variants to it, there is no option to add variants, whether I choose from selecting the product from my list of products and clicking on the dropdown "More Actions", or using "Edit Product", or going into the product page itself. 

Please help.  I want to add variants to a product from the Craft theme of my online store, but the few online "solutions" I've thus far found are not doing the job.  

Thanks.  LS

Erin
Shopify Staff (Retired)
1116 137 182

Hi there @lacysaunders. Thank you for all of that context! Are you setting up your store for the first time or making updates to it?

 

It sounds like you are having trouble adding variants to your products in general. This won't depend on the theme you are using and is completely done within the Products section of the Shopify Admin.

 

To add a variant to an existing product you will want to follow these steps:

  1. From your Shopify admin, go to Products.
  2. Click the name of the product.
  3. In the Options section, click Add another option. You may first need to check This product has options, like size or color for the settings to appear.
  4. Enter the option information in the fields.
  5. Click Save

You can also read more about adding variants in this guide here. It explains the other ways to get variants added.

 

Please let me know if you go through those steps and are still having trouble! I'm happy to help further.

Erin | Shopify 
 - Was my reply helpful? Click Like to let me know! 
 - Was your question answered? Mark it as an Accepted Solution
 - To learn more visit the Shopify Help Center or the Shopify Blog

Helmets
Visitor
1 0 0

Hello Erin,

I am having the same issue on Pyrotect Pro-Sport Duckbill SA2020 Racing Helmet – Helmet City

This is a custom theme and I do not have the Variant Picker Block to add.

How and where would this need to be coded into Liquid?

Thank you

Erin
Shopify Staff (Retired)
1116 137 182

Hi there @Helmets!

 

Since you are using a custom third party theme I'd recommend reaching out to your theme developer for further help with this. They will have the most information on your theme to assist you. If your theme developer is unable to help, you can also hire a Shopify expert. Shopify experts are trusted, third-party agencies and freelancers who offer services for Shopify merchants. You can read more about Shopify experts here and you can hire one here.

 

Please let me know if you have any questions!

Erin | Shopify 
 - Was my reply helpful? Click Like to let me know! 
 - Was your question answered? Mark it as an Accepted Solution
 - To learn more visit the Shopify Help Center or the Shopify Blog

klikzmk
Tourist
10 0 3

you are awesome 

Karim52
Visitor
3 0 0

Hey, Erin, I need some help with my Shopify store. I can not see my variants on my page. When I go to product and add my collection and click save my variants aren't popping up on my store page. What do I do? 

Erin
Shopify Staff (Retired)
1116 137 182

Hi, @Karim52. I'm happy to look into this with you! I just have a few questions to start troubleshooting. 

  • Are your products missing from your storefront as well, or just the variants set up for a product?
  • Are your variants visible in your Shopify admin, but not on your storefront? Or are your variants removed from everywhere after you try to save them?
  • Are you following this guide to add variants to products?
  • Have you already set up your online store's navigation to include your products and collections?

Once I have more information I can share some advice on how to fix this. Please let me know if you have any questions!

Erin | Shopify 
 - Was my reply helpful? Click Like to let me know! 
 - Was your question answered? Mark it as an Accepted Solution
 - To learn more visit the Shopify Help Center or the Shopify Blog

Karim52
Visitor
3 0 0
Yes, my product and the variants are visible in my Shopify admin but not on
my storefront. But when you go and view my store you can not see the
variant of my products. Why is this happening?
Erin
Shopify Staff (Retired)
1116 137 182

Hi, @Karim52. Thanks for your reply! I'll need a bit more information before I would be able to say for certain why this is happening.

I look forward to hearing back from you so we can continue working on this!

Erin | Shopify 
 - Was my reply helpful? Click Like to let me know! 
 - Was your question answered? Mark it as an Accepted Solution
 - To learn more visit the Shopify Help Center or the Shopify Blog

Karim52
Visitor
3 0 0
Yes I’ve set up a navigation to product and collection. When I go to my
collection I can see the variants but when I go to my store the variants
are not visible. Like for example when I search up my store and click on a
product I am not able to see the other options. But when I view my page in
admin I’m able to this variants.
Erin
Shopify Staff (Retired)
1116 137 182

@Karim52 Thank you for clarifying all of that! Would you feel comfortable sharing your storefront's URL? The reason I ask is so that I can test if I'm able to see the variants on my end. I was also wondering if you've had a chance to view the products on your website using any other devices or browsers? Sometimes your cache or cookies can effect how your website is displaying for you, but customers can still see things correctly. The fix for this is usually just to clear your cache and cookies, and update the device and browser you're using.

 

If it's still not appearing correctly after you try this, it may be best for you to speak with our live support team here. I'm not able to see your account information over the Shopify Community, but if you reach out to us through the page I shared, we can review your products with you in more detail. You can follow these steps to request support:

  1. Start on this page.
  2. Log in to your account.
  3. Select a topic most related to your question or problem.
  4. Continue to the support options listed under the suggested articles and guides.

Don't hesitate to let me know if you have more questions, or if you have trouble reaching our live support team. 

Erin | Shopify 
 - Was my reply helpful? Click Like to let me know! 
 - Was your question answered? Mark it as an Accepted Solution
 - To learn more visit the Shopify Help Center or the Shopify Blog

Nini0415
Visitor
1 0 0

Hi Erin,

 

I'm using theme Craft, and having the same problem. My variants did show up on my storefront after my first setup yesterday. But when I tried to add variants to new products today, they didn't show up anymore (The first showed-up variants are still here). I have tried using a laptop and iPhone, and there was no difference. 

 

Thanks,

Nini

Erin
Shopify Staff (Retired)
1116 137 182

Hi, @Nini0415! I can definitely look into this with you if you're still noticing this problem. I just have a few questions to make sure I'm understanding properly, and give you accurate advice.

I look forward to hearing back from you!

Erin | Shopify 
 - Was my reply helpful? Click Like to let me know! 
 - Was your question answered? Mark it as an Accepted Solution
 - To learn more visit the Shopify Help Center or the Shopify Blog

cl4udio
Shopify Partner
2 0 1

Thanks, was worked for me.

 

In some themes it's possible need to check the right side menu after clicking into the "Product" block, just to check if the "variations option" is active under the Theme Options tab. 😎👍

 

cl4udio_0-1678468966972.png

 

bkorn6
New Member
4 0 0

I am also having trouble with my variants showing up when I go to preview my product. And yes, my variants were all inserted correctly on my admin page. I have color and size filled out for all of them.

I didn't know if it was just a problem with the color of my text, but I even changed that with themes. Please help:)

Screen Shot 2023-06-28 at 1.12.04 PM.png

Screen Shot 2023-06-28 at 1.12.14 PM.png

Erin
Shopify Staff (Retired)
1116 137 182

Hi, @bkorn6. Thank you for those screenshots! I have a few questions to better help you with this.

  • Which theme are you currently using?
  • Was this working correctly for you before or have you always had this issue with your variants?

To start troubleshooting this I recommend testing out how your variants appear when you preview a different theme. To do this, please add one of our free themes to your shop from the theme store here. This will allow us to see how your store operates with a new, unedited theme without making any changes to how your storefront currently appears to customers. Once you've added a new theme, go to Online store > Themes in your Shopify admin and find the new theme under the Theme library area of the page. From here, click ... > Preview (next to the new theme you added).

 

If your variants are appearing correctly when viewed with this preview, the issue is likely being caused by the theme you have published to your online store (the one in the screenshots you shared). If you're having the same issue with your variants when you view them while previewing a different theme, we would need to look into this more to determine what's causing the issue.

 

Please try that out and let me know if you have any questions!

Erin | Shopify 
 - Was my reply helpful? Click Like to let me know! 
 - Was your question answered? Mark it as an Accepted Solution
 - To learn more visit the Shopify Help Center or the Shopify Blog

Daud1
Visitor
1 0 0

Hello Erin, 

I have also suddenly started experiencing the same issue. I have never had any issues with color options before but it suddenly appeared a few days ago. Not sure what changed? Hope you are able to help me out with this. 

jo_midwinter
Visitor
1 0 0

Hello! It doesn't seem like this is an option in my theme. Are there any recommendations for what else I can try?Screen Shot 2023-10-17 at 10.45.02 AM.png

Puurchantal
Visitor
1 0 0

Hi Erin,

I'm experiencing a similar issue. What I've observed is that when I attach an image to a color variation, the variation only becomes visible when you select that specific color for ordering.

 

However, what I want is to have all the variations displayed upfront, and when users decide to place an order, the chosen color of the product should appear so that they can visually confirm their choice.

 

It's kinda strange to me that it hides that specific media when added to a variation as I never experienced this with any other system or service. For your reference, I use the starter plan.

 

Hope you provide me with a solution. Thanks for your support.

 

Chantal

RagingRabbit
Visitor
1 0 0

Thank you!!!!!!