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

[TheResinator]

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 

[Erin · 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:

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.

[TheResinator]

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

[Erin]

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.

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.

[Ivanamaree]

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]

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.

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

[lacysaunders]

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]

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.

[Helmets]

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]

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!

[klikzmk]

you are awesome 

[Karim52]

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]

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!

[Karim52]

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]

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.

• When you say your variants are missing, do you mean that the product appears, but not the variants? Or is the product itself missing as well?
• Are you following this guide to add variants to products? If not, can you walk me through how you've added variants to your products?
• Have you already set up your online store's navigation to include your products and collections?

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

[Karim52]

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]

@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. 

[Nini0415]

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]

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.

• Can you walk me through the steps you're taking to add variants to your products? Are you adding variants to existing products using these steps? Or are you adding variants while creating new products like in these steps?
• Are you only missing the variants from the storefront or are they missing from your Shopify admin as well? 

I look forward to hearing back from you!

[cl4udio]

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. 😎👍

[bkorn6]

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:)

 

 

[Erin]

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!

[Daud1]

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]

Hello! It doesn't seem like this is an option in my theme. Are there any recommendations for what else I can try?

[Puurchantal]

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