Hello, I have been searching and cannot find a code that works. I am wanting to have item photos for products that do not have variants and are sold out to automatically be reduced in opacity. I also am wanting to make items that have variants have “grayed out” variants in the product drop downs s…

Hi @NCCShop , Go to Assets > theme.css and paste this at the bottom of the file: .grid-product__tag--sold-out+.grid-product__link .grid__image-ratio { opacity: 0.5; } Hope it helps!

Hi @NCCShop , Please send your site and if your site is password protected, please send me the password. I will check it.

https://bogntvw3qxst1nyz-54968811584.shopifypreview.com Here is a preview of my password protected website. If this doesn’t work let me know. Thank you!

Thank you SO SO much!! That worked. :slightly_smiling_face:

Hi @NCCShop I can not get this code to work on my theme: Supply Under Assets, the option is theme.scss.liquid and not theme.css Please can you help? Many Thanks, Oliver

Hi @LondonDGC , You can create a question on the community and send me the link. I will check it. Because this will help build a better community. Thank you.

Thank you! I am currently trying to achieve the same with a custom theme. Can someone help me to implement this functionality to gray out sold out products on the homepage? https://a1r9snlxn6pa8j57-45477658773.shopifypreview.com

How to automatically reduce opacity for sold out items?

Technical Q&A

LondonDGC November 15, 2022, 10:41pm 8

Posted and tagged you in it. Thank you

Topic		Replies	Views
How to grey out sold out variants in the product drop down? Technical Q&A shopify-theme	4	70	November 17, 2022
How to change the opacity of sold out items? Shopify Discussion troubleshooting	2	43	May 21, 2023
Sold Out Items opacity and gray out Studio Theme Technical Q&A optimization , css , shopify-theme	14	116	July 25, 2023
Make out of stock variant appear opaque on product page Store Design customizations , footer	0	17	September 29, 2023
Reduce Opacity On Thumbnail Images For Sold Out Variants Store Design	1	27	August 19, 2021

How to automatically reduce opacity for sold out items?

Related topics