How can I adjust image opacity on Debut theme collections?

1 0 0

I am using Debut theme and I would like to change way of working of my collection (I think there is simple solution but I am lost in my css) 🙂
So when picture  it is normal...0 I would like to has it without any opacity 0% (just 100% image).
And when the cursor is over, then the (picture) turns a bit gray (opacity turns to 70%).
Thank you in advance

Reply 1 (1)

Shopify Staff
2220 247 506

Hey, @glogana 

Thanks for asking your question in our design forum. This is the place to go when it comes to coding advice where you can hopefully have someone with insight regarding your particular request provide you with the necessary code. With that said, I am not formally trained in code to be able to assist you directly but I just wanted to leave a valuable alternative solution if you are unable to get an answer in the near future. Shopify has an experts platform that allows you to find and hire a developer for small and large coding gigs. With the help of an expert, they could definitely help you do this at a modest cost. If you would like to learn more, feel free to check out our Shopify experts directory.

Alternatively, if you want to try to make the coding changes yourself, I was able to find an older forums post that has some provided code on adding a hover effect to collection images here. Feel free to check that out. Also, be sure to duplicate your theme before making any changes to the theme code. That way, if something accidentally breaks, you have a working version of your theme to fall back onto.

If there is anything else I can help you with, please let me know.


Dirk | Social Care @ 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