Remove/hide Sold out Badge for out of stock Products. (Dawn Theme)

[Loz86]

Hi guys,

As per my title, just looking to remove/hide the Sold out Badge on the collection page for products that are out of stock.

Collection example page: https://onlinebeautyessentials.com/collections/aveeno

The above image (where the red arrow is pointing to) is the sold out badge I had just changed the text to Coming soon.

I don’t want to hide/remove the “Sale” badges just the sold out ones.

[Dan-From-Ryviu]

Hi @Loz86

Go to your Online store > Themes > Edit code > Assets, open base.css file, add this code at the bottom

.grid__item .card-wrapper:has(.price--sold-out) .card--media .card__badge { display: none !important; }

[Loz86]

Much appreciated @Dan-From-Ryviu !

I managed to remove it from the product page myself in about 2 minutes but just couldn’t remove that collection page one.

Sent you a little donation on buymeacoffee

[Dan-From-Ryviu]

Thanks and welcome.

[Loz86]

My pleasure.

If you wouldn’t mind, would you briefly explain your snippet so I can better understand why the ones I was writing wasn’t working.

[Dan-From-Ryviu]

My code checks what product “price–sold-out” class and points to class to need to hide

[Loz86]

Ahh yes I understand now,

I think users being able to understand the snippets provided on here is just a important as the snippets themselves so thank you much for the explanation