Hide prices of sold out products on product page

Store Design
1

hey,

I am using the Dawn theme and needing to hide prices of sold out products on the individual product pages. I have managed to hide the prices on collection pages. I have tried many different codes however nothing has worked.

Any help is greatly appreciated

Thanks!

2

Hey @Dusty_Dot ! I think you should be able to do this with CSS.

  1. Go to Online Store > Themes > Edit code (I assume you’re familiar with this since you’ve tried a few other options
  2. Look for this file - base.css
  3. Add the following CSS code -
.product__info-container .price--sold-out .price__regular {
  display: none;
}

Save, and that should be it! Let me know if that worked?

3

Hi @Dusty_Dot
Please put this code in theme.liquid before body closing tag

Thanks!

4

Thank you for your option, but sadly it’s still showing the price

5

Hey,

I’m not sure if I entered it in the wrong part of the theme.liquid file but sadly didn’t work

6

Sorry to hear that! I tested this out on our test store with a fresh copy of Dawn, and it worked then. If you need help with it, let me know and I’ll be happy to give it a look. :slightly_smiling_face:

7

did you just add it to the bottom?

8

You can add it anywhere to the ‘base.css’ file and it should work. I added it close to the top, and that worked for me.

9

I added it further up (just under the /* base */ section) and it worked!

Thank you so much!

I am now realising the available products are showing the price twice on the product page, not sure if you have any tips on removing that too :joy: so it just shows the price once

10

Glad to hear that worked! (If you don’t mind, please consider marking that as the solution :grin: )

Do you have a screenshot or store link I can look at? If you could send me that in a DM, I’ll definitely give it a look. :slightly_smiling_face:

11

Thank you and done! :blush:

here’s a screenshot of the product page

Dusty_Dot_0-1715653389063.png
Dusty_Dot_0-1715653389063.png1530×1038 277 KB

12

Thanks, I’m DMing you to get a link to the page. That’ll help me find the right solution right away. :slightly_smiling_face:

13

Hi @Dusty_Dot
Can you please provide screenshot of theme liquid where you put this and also the URL of the frontend where issue is appearing, It will help me to look into more details
Thanks!

14

Hi @Sandy-STOQ I think I sniped this soultion as well, but now we started using the “compare at“ option. When using this the prices keep showing on the shop. Is there some extra CCS we could add to make this work? Otherwise we would just have to remove all the compare at settings…

15

This is a Dawn + CSS limitation, not your setup :+1:
When you enable compare-at price, Shopify renders extra price elements, so the original sold-out CSS rule no longer catches everything.

To fix it, you need to hide all sold-out price blocks (regular + sale + compare), not just one. Otherwise prices will reappear when compare-at is active.

That said, this is why a lot of merchants stop relying on CSS for price hiding — every theme or pricing change breaks it again. Some switch to hide price app so prices can be hidden by status (sold out, collection, product) without touching theme code