Display Inventory Quantity on the Product Page

Display Inventory Quantity on the Product Page

brad_hembrow
Visitor
1 0 0

I am trying to show inventory quantities on the product page. I'm using the Icon Dolce Theme. is this an easy fix? I have no experience with liquid or modifying Shopify themes.

Replies 19 (19)

Jai1
Explorer
92 0 16

Hi Brad,

let you know how to add that inventory show on product detail:

In order to enable the inventory tracking option, navigate to your HTML/CSS editor and select the product-template.liquid. Scroll to line 111 and paste the following code:

   {% comment %} Inventory tracking on product page {% endcomment %}
            <div id="variant-inventory" class="{% unless current_variant.available %} hide {% endunless %}">
              {% if current_variant.inventory_management == "shopify" and current_variant.inventory_policy != "continue" %}
              We have {{ current_variant.inventory_quantity }} in stock.
              {% else %}
              This product is available.
              {% endif %}
            </div>

If your product does not have inventory tracking enabled, it will simply read as, "This product is available." 

 

If you have any more query or help then you can sent mail me at jaygandhi0692@gmail.com

shoot mail if you need any help : jaygandhi0692@gmail.com
YahiraCharmLove
Visitor
2 0 1
Hi can I access HTML CCS editor on my mobile phone? If so, where do I find it? Thanks
BriskDevelopers
Shopify Partner
120 11 21
Hi Yahirachimelove,

This feature is not default provide by shopify, you need to write custom code in your theme for display quantity based on dropdown value change and swatch change.
If helpful then please Like and Accept Solution. Want to modify or custom changes on store Hire me. Feel free to contact us regarding any help, below our contact listed:
Shopify Expert Page: https://experts.shopify.com/brisk-developers
Email: support@briskdevelopers.com
Contact us: https://www.briskdevelopers.com/contact-us
Skype: briskdevelopers
rulove
Visitor
1 0 0

go to the bottom of your store, to "theme actions" or something like that, i have it in spanish jajaja.
then cick on the 3 dots and on the top 

bikinisblazers
Visitor
1 0 0

Hi,

 

I am wanting to show the sizes available on the bottom of the page. Attached is an example of what I am wanting.

 

Can you please tell me what code to use for this as I am new to it?

 

I want to show the sizes and available sizes at the bottom of the item so they do not have to click the item to find it, they will already know if their size is available for them. 

 

Thank you so much,

Paige

Screen Shot 2020-08-20 at 4.26.34 PM.png

 

 

krlove80
Visitor
2 0 0

Hello Paige,

I am not a code expert lol 😂, but when you add your products there is an
option to add a variant, there you will be able to add sizes, colors or
styles to the item you want to sale.

I do hope that helps. If not please contact Shopify Support team. 😃😊

Momin313
Visitor
1 0 0

Hi Jay

 

Hoping that you or anyone else is able to help me show the available qty of each size on the product / collection pages in my online clothing store (like a hover over display)

www.threehundredthirteen.com

We use a theme called ICON MASTER

As most stocks are now very low customers have to keep clicking in then coming back out and so on till they can fund something available in their size.

 

Thank you 
Momin 

HB06
Visitor
1 0 0

Hi, 

It is not working in Supply theme, can some one please help.

Infonm2022
Visitor
1 0 0

Hi Jai1 
I have theme "Craft" one of the new shopify free themes, and I don't have "product-template.liquid" in my edit/code pages.. which page/line I should add the code to it? Thank you for your help in advance.

felicemcmillan
Visitor
1 0 1

Hi,

I used that code on my shop to show inventory on a product page, but it is not working as I expected. The problem is when a product has variants, for example, if variant 1 has 10 items in stock and variant 2 has 8, it doesn`t update the quantity when I change from variant 1 to 2 (variant 2 is showing 10 instead of 8), only if I refresh the page. Is there a way to fix this?

BriskDevelopers
Shopify Partner
120 11 21

For Display or Update inventory quantity on product page based on the variant, dropdown changed then we need to write custom javascript code in your theme files.

You can check at our client website we already did for them.

Client Website 1:
https://rheemprogear.com/products/metal-key-tag-w-bottle-opener


Client Website 2:
https://ruudprogear.com/collections/frontpage/products/triton-intelligent-tee

If helpful then please Like and Accept Solution. Want to modify or custom changes on store Hire me. Feel free to contact us regarding any help, below our contact listed:
Shopify Expert Page: https://experts.shopify.com/brisk-developers
Email: support@briskdevelopers.com
Contact us: https://www.briskdevelopers.com/contact-us
Skype: briskdevelopers
You2sell
Visitor
1 0 1

Hi, 

 

Im looking for Display Inventory Quantity on the Product Page solution. On my shopify store. 

TVCS
Visitor
3 0 0

Same here, also looking for a solution to this

HelloPaul
Tourist
26 0 1

@You2sell @TVCS 

Add this code to your product-template.liquid file. I'm using the Simple theme, and it goes immediately after line 112 (after "<div class="product-single__policies rte">") and that works for me:

{% comment %} Inventory tracking on product page {% endcomment %}
            <div id="variant-inventory" class="{% unless current_variant.available %} hide {% endunless %}">
              {% if current_variant.inventory_management == "shopify" and current_variant.inventory_policy != "continue" %}
              We have {{ current_variant.inventory_quantity }} in stock.
              {% else %}
              This product is available.
              {% endif %}
            </div>

More details are here: https://community.shopify.com/c/Shopify-Design/How-do-I-Show-inventory-quantities-on-product-pages-u...

What I now want to do is show the inventory at the various locations. Anyone know how to do that?

Katrina5
Visitor
1 0 0

This works on the Supply theme, but not in the Venture theme, can anyone tell me how to add this to the venture theme?

krlove80
Visitor
2 0 0
Add this code to your product-template.liquid file. I use the "Minimal" theme and it goes immediately after line 183 (after "<div class="product-single__policies{% if product.has_only_default_variant and section.settings.product_quantity_enable == false %} product__policies--no-dropdowns{% endif %} rte">")
 
This code is different from above so it may very well work as the above didn't work until I tried this one. 😃
 
<div id="variant-inventory">
 {% if product.variants.first.inventory_management == "shopify" %}
    {% if product.variants.first.inventory_quantity > 0 %}
       We currently have {{ product.variants.first.inventory_quantity }} in stock.
    {% else %}
       The product is out of stock
    {% endif %}
 {% else %}
    This product is available
 {% endif %}
</div>
 
 
Kevin0214
Visitor
2 0 0

Can seem to make it work on the supply theme

larango
Visitor
2 0 0

I have variants for my products as well and was not able to get that code to work. Any suggestions?

thelittlewolf
Visitor
2 0 1

is there a way to do this with the spolight theme?