Hiding variant options on all pages but product page?

Store Design
1

Hi,

For each of the products on my site, there’s about 6 different options for what size to choose, but I’d like to hide those options from being viewed on the homepage and collections pages so that they only show up when you click on each individual product. It just looks cluttered to have all of those options underneath each product when I’m trying to showcase a collection. I’m using Turbo theme for this site. Any help would be greatly appreciated, thanks !

2

Hi @harveyvaughn3

Sincerely hope you’re having a great day!

I’ve read your problem and before providing a solution, would like to analyze your website. Then, I will provide a solution to you up here - on the forum.

Could you share your website URL? And if your website is password protected then also provide a password?

3

https://www.paintbynumbershq.com is the URL. Thanks :slightly_smiling_face:

4

Hi @harveyvaughn3

Hope you’re having a great day!

scrnli_22_05_2021_15-34-42.png
scrnli_22_05_2021_15-34-42.png820×185 3.49 KB

By following the steps above, copy this code and place it completely at the end of the following files:

  • sections/product-template.liquid
  • sections/collection-template.liquid
{% stylesheet %}
.swatch_options {
    display: none;
}
{% endstylesheet %}

Make sure there is no ‘{% stylesheet %}’ tag in the files before using the above code. If there is, you will have to use the code below instead, placing it just before the closing ‘{% endstylesheet %}’ tag that is already in the file concerned.

.swatch_options {
    display: none;
}

Fixed example:

Animals-Paint-by-Numbers-HQ.png
Animals-Paint-by-Numbers-HQ.png1366×695 243 KB

If you found this comment useful, hit the ‘Like’ and ‘Accepted solution’ buttons.

5

Hi @Morek

I had the same questions and I have used this code you recommended in a couple of places:

  • sections/collection-template.liquid AND
  • sections/search-template.liquid

I have NOT used it in product-template.liquid as it deleted the varianys from the product listing itself and I tried it on product-recommendations.liquid to try and remove the options from the recommended products - BUT once again - it removed the variants from the product listing itself.

Do you know where i need to post the code to stop the variants appearing at the bottom of the product page and any other places on the site other than the product listing itself.

I have attached a powerpoint - I hope it makes sense!!

Thank you.

www.looselemoncrafts.com is the website.

1 Like