Shopify themes, liquid, logos, and UX
I've been trying to find a way to affect a single specific product regardless of where it's shown on the site. I want just this one product to have a different background/hover affect via CSS.
Since we can't add a css class/id to a product in backend, here's what I've attempted and failed so far.
What other options are there? To help clarify, think of it like this. If I have 10 products in my shop. I want a hover effect on all of them (throughout the site) EXCEPT a specific one of those 10. It gets different hover effect.
Thanks for any additional brain power you might have. =D
Hi @roborob,
You just need to add the product handle class to each product item, then you can css it, it will work separately.
Which theme are you using? I can help you check it in detail.
That's doable?! That would be perfect if I could target a class per product.
The theme I'm using is called Label.
Thanks in advance for any direction you might have.
Hi @roborob,
Can I send you a collaborator invite? it will help me check the files to change and add the code for you
I'm trying to accomplish this too!! How do I get a product card to have a unique class based on the handle? @namphan would love your instruction 🙂
Hi @btuttle,
Please send me the theme name, I will check it for you
Learn how to build powerful custom workflows in Shopify Flow with expert guidance from ...
By Jacqui May 7, 2025Did You Know? May is named after Maia, the Roman goddess of growth and flourishing! ...
By JasonH May 2, 2025Discover opportunities to improve SEO with new guidance available from Shopify’s growth...
By Jacqui May 1, 2025