How can I hide prices for items that are sold out?

How can I hide prices for items that are sold out?

SCWTire
Visitor
2 0 0

Currently, in my online store, some of the items are sold out. However, I would like to change my pages so that when an item is sold out(quantity = 0), the price for that item, or variant, is hidden. How can I go about doing that?

Sorry, I am not sure what theme I am using, since I just started using Shopify.

Replies 12 (12)

SohelRana
Explorer
62 4 6

Hey there, you have to put some codes on your product-template.liquid file on your theme. Send me your store link and let me know if you need help to do this. Best of luck!

To get Shopify Store Design, Customization and Development service, Inbox me on Upwork. Link in my bio or left side.
SCWTire
Visitor
2 0 0

My store link is scwtire.com. Thank you for your time!

 

Ninthony
Shopify Partner
2343 354 1041

You'll need to track down where your price occurs in your product.liquid file. Inside that file you may see something like:

 

{% section 'product-template' %}

//or

{% include 'product-template' %}

If it says section, you'll be looking for a section file named "product-template.liquid" -- If it says include, you'll be looking for a Snippet with that name. Then locate your price in your code. Ctrl + F and search for price. There may be a couple instances of it or more. You'll be looking for something like:

 

{{ product.selected_or_first_available_variant.price }}

It could be something different, there's no telling really. You'll need to put something next to it to see if you're in the right spot. Save, then refresh to see if whatever you typed appears next to the product price. If it does, then you know you're in the right spot and you can put a conditional statement around it:

 

{% if product.available %}
{{ product.selected_or_first_available_variant }}
{% endif %}

Then it will only show it if it is available.

If my solution helped you, please like it and accept it as the solution!
If you'd like to make any edits to your store, please send me a personal message and we can discuss what you'd like to accomplish 😄
BentleyC
Visitor
3 0 0

HI 

 

I'am trying to do the same with hiding the price when Sold. I have followed your steps closely but when I paste the code into my store near where I tested some text it doesn't hide the sale price. Can you help? www.tasmanianacoustictonewood.com.au/

 

Thanks,

Bentley

BOT1
Tourist
13 0 1

@Ninthony 

Nice but i can't seem to find the function that shows the price?

So, a section (line 154...minimal theme) of the "product-template.liquid" (please see below, where would i place another condition please?).

1. Just wanna hide price of "out of stock" items & display "unavailable" if possible please? 🙂  cheers

 

<div class="grid__item post-large--one-half">
{% if section.settings.product_vendor_enable %}
<span class="h3" itemprop="brand">{{ product.vendor }}</span>
{% endif %}
<h1 class="product-single__title" itemprop="name">{{ product.title }}</h1>

<div itemprop="offers" itemscope itemtype="http://schema.org/Offer">
{% assign variant = product.selected_or_first_available_variant %}

<meta itemprop="priceCurrency" content="{{ cart.currency.iso_code }}">
<link itemprop="availability" href="http://schema.org/{% if product.available %}InStock{% else %}OutOfStock{% endif %}">

<div class="product-single__prices{% if shop.taxes_included or shop.shipping_policy.body != blank %} product-single__prices--policy-enabled{% endif %}">
<span id="PriceA11y" class="visually-hidden">{{ 'products.product.regular_price' | t }}</span>
<span id="ProductPrice" class="product-single__price" itemprop="price" content="{{ product.price | divided_by: 100.00 }}">
{{ product.price | money }}
</span>

{% if product.compare_at_price > product.price %}
<span id="ComparePriceA11y" class="visually-hidden" aria-hidden="false">{{ 'products.product.sale_price' | t }}</span>
<s id="ComparePrice" class="product-single__sale-price">
{{ product.compare_at_price_max | money }}
</s>
{% else %}
<span id="ComparePriceA11y" class="visually-hidden" aria-hidden="true">{{ 'products.product.sale_price' | t }}</span>
<s id="ComparePrice" class="product-single__sale-price hide">
{{ product.compare_at_price_max | money }}
</s>
{% endif %}

{% include 'product-unit-price', variant: variant, available: true %}

L_M_I_94
Visitor
1 0 0

I need help with this as well. I see the line of code as referenced above but I don’t know what condition to put in to hide the price for sold out items.

Please help.

No6Cavendish
Visitor
1 0 0

Hello there, 

I am trying to do the same and i have followed the steps above but it doesn't seem to be working? I am trying to hide the price on sold out products but I want to keep the product on show. 

I look forward to your response

Thanks

Rekha

 

faerysteps
Tourist
5 0 1

I am also trying to hide the price on sold out items whilst still having the Sold Out tag showing. I am using the Debut theme. Its a shame there isn't an easy fix for this 😕

TJK96
New Member
5 0 0

Hi im having the same issue and it doesnt seem to work, could you help?

Euphoric
Visitor
1 0 0

I highly appreciate your hard-working skills as the post you published have some great information which is quite beneficial for me, I hope you will post more like that in the future

 

 

 

luxuryluke
Visitor
1 0 1

Prices are likely now in the price.liquid file, where I did it like this (Dawn 6.0.2 theme):

{% if product.available %}
   <span class="price-item price-item--regular">
     {{ money_price }}
   </span>
{% endif %}
   

 

AA_1
New Member
4 0 0

Hi Ninthony, I need help with this. Would like to hide price for Sold out Items. Could you help me? Thanks