Hide pricing on sold out items, in featured collection on home page

I have successfully hidden prices on sold out items in the rest of my shop, but I’d like to apply this to the home page– Featured Collection– so that prices beneath sold out items are also hidden. The theme is Be Yours. Thank you

Hi @pitchpinepottery

Go to: Online Store → Themes → Edit code
Open: assets/component-price.css or assets/base.css
Scroll to the bottom

You can add below CSS to hide price of all sold out products:

.card-information .price.price–sold-out {
display: none;
}

Click Save

Thanks & Regards

Hi,
We’ve just tried both, and that has no effect on the home page, featured collection prices.

please advise

Hi @pitchpinepottery SEARCH first for basic problems, saves a ton of time in the short and long run.
And is a rule.
https://community.shopify.com/guidelines
eg. Search results for 'be your hide price'

If the theme developer has multiple themes also search those names

Could you please share the store URL? If it’s password protected, kindly share the password as well.

Since you have not shared your URL, I’d try on the demo store.

Sold out products have a “sold out” badge, so we can use this fact to decide whether to hide price or not.

So, you can try this code in “Custom CSS” under “Theme settings”:

.product-grid .card-wrapper:has(.badge--soldout) .price {
  display: none;
}

Before/After:


if my post is helpful, please like it ♡ and mark as a solution -- this will help others find it