How can I replace the price of sold out items with "sold out" on my collections page.

[dgonz]

I want to replace the price of a sold out item with "SOLD OUT" on my main store page. I dont wanna do this to the product page, just the main collections page. Any help? 

Site: reticentofficial.com 

[Prezentech · Accepted solution]

Hi @dgonz ,

You can add below CSS in the theme.scss file of the theme.

.price--sold-out .price__regular {
    display: none;
}

To edit the theme.scss, go to Online store -> Themes > Edit code > Search (theme.scss).

Please accept this solution if this works for you.

Thanks,

[Wahab_Ahmad]

Hello @dgonz,  please explain your problem. Provided details do not show a clear picture of the problem. Explain your problem with reference pictures.

[dgonz]

  

I want to hide the price of sold out products and only show the sold out badge. But I only want to do this on the main collection pages like the one here. Not on the product pages. 

@Wahab_Ahmad 

[Prezentech · Accepted solution]

Hi @dgonz ,

You can add below CSS in the theme.scss file of the theme.

.price--sold-out .price__regular {
    display: none;
}

To edit the theme.scss, go to Online store -> Themes > Edit code > Search (theme.scss).

Please accept this solution if this works for you.

Thanks,

[dgonz]

@Prezentech 

Thank you that worked, but now on the product page, the price is gone, anyway I can get that back?

[Prezentech · Accepted solution]

As there is no different class in both the pages so it is taking common CSS but you can solve by adding one more CSS

.product-template__container .price--sold-out .price__regular {
    display: block;
}

[dgonz]

Thank you so much, it worked! @Wahab_Ahmad 

[juliantiscione]

how did you add that sold out box in the first place?