There’s a pure CSS solution for this problem. Make sure the price and sold out mark are siblings in your HTML:

{@|product-status}
{@|product-price}

Then you can target the price class with a general sibling combinator selector (~) in CSS:

.sold-out ~ .product-price {
   display: none;
}

The price will only disappear when the sold out class is active.

@JulesHugal

This worked great for a few months.. then it stopped. Here's my fork to get it working again:

page > #productList > .sold-out > div > .product-overlay > .product-meta > .product-price {display: none;}

http://cjohn.design

I just deleted the sales price on my item and typed in a decimal point and made item quantity 0. This allowed the item to show ‘sold out’, and $0.00 as the price.

If there is a better way, I would love to hear, but for now, this is the solution I came up with.

I just deleted the sales price on my item and typed in a decimal point and made item quantity 0. This allowed the item to show ‘sold out’, and $0.00 as the price.

If there is a better way, I would love to hear, but for now, this is the solution I came up with.

Something along the lines of this:

YUI().use('node', function (Y) {
   Y.all('.product').each(function(){
       if (this.one('.sold-out')) {
           this.one('.product-price').hide();
       }
   });
});

Insert in Code Injection (in script tags)

Thank you!

It won't let me use $0.00 as a price, so all of my out-of-stock items are set to $0.01.

Hi @Alex -- Thanks. This works great on the product list page - but then price still shows on the product detail page, along with an ADD TO CART button (which is very confusing). Would you mind to let us know how to get rid of price and add to cart on that page?Thanks a lot

Hello,

This article looks like just what I need but I am having difficulty using it to hide the prices on all sold out items in my Shop & Product pages:

Shop page: http://www.ashleighdix.com/shop/Product page: http://www.ashleighdix.com/shop/flushed

Please could someone advise...?

FYI: - I am running some JS to change ‘Sold Out’ to ‘Sold’ and to hide the ‘Add-to-Cart/Purchase’ button for out of stock items.

Many thanks in advance… :)

Hi mvpottery,You may find this article useful...? https://answers.squarespace.com/questions/154547/how-to-disable-the-add-to-cart-button-for-all-sold.html#answer-154628

Answered here: https://answers.squarespace.com/questions/154657/hide-price-on-out-of-stock-items-in-product-produc.html

Hi mvpottery... Here's another one which may help you as it combines some of the code from the previous thread and tidies it all up... :)https://answers.squarespace.com/questions/154657/hide-price-on-out-of-stock-items-in-product-produc.html

Hello rishisavera,

if your shop is running on Magento and this topic is still relevant, I would suggest you take a look at some of the add-ons which allow hiding prices either temporary or permanently. One of them I've personally used is Magento 2 Hide price extension from ITORIS INC.