How do I Show inventory quantities on product pages using Debut theme?

New Member
2 0 0

I am trying to accomplish Show inventory quantities on product pages

I've looked in the theme.liquid, product.liquid, product-template.liquid, theme.js.  I can't find the selectCallback function anywhere within the Debut theme.  Any suggestions?

0 Likes
Shopify Staff
Shopify Staff
540 0 67

Hey there, Alex!

 

Savannah here from the Shopify Guru Team.

 

The tutorial that you linked hasn't been cleared to work with sectioned themes (like Debut), but I can let you know how to add that feature. 

 

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." 

Let me know if you have any questions!

 

Savannah | Shopify Guru

 

2 Likes
Tourist
5 0 2

Hey Savannah,

I followed your instructions, I too am using the "debut" theme. This doesn't appear to update when someone is changing the variants. I believe the poster was running into the same issue. Any help would be appreciated.

1. I need to show the current inventory.

2. I need the inventory numbers to update when a user selects a different variant.

 

2 Likes
Shopify Partner
2536 31 562

Hey John,

your question is answered in this post

Want to hire me to tweak a theme? Mail me at tairli@yahoo.com! My post solved your problem? This is my Paypal too :)
1 Like
Tourist
5 0 2

Thanks Tim. The only problem I have now is that the page doesn't seem to recognize the default variant. So it says, "This product is out of stock" by default. If you select the variant from the dropdown, it will then load correctly. Any ideas?

0 Likes
Tourist
5 0 2

I am sure it has to do with:

 

 <h4 id="variant-inventory">
  		{% if product.selected_variant.available %}
    This product is available</h4>
  		{% else %}
    This product is out of stock
 	    {% endif %}
		</h4>

Since perhaps the page doesn't know that the default variant is actually selected, it defaults to "This proudct is out of stock".

0 Likes
Shopify Partner
2536 31 562

Can you share a link? (if your theme is unpublished, you still can share a link by right-clicking the preview (eye) button and copying the link address).

Want to hire me to tweak a theme? Mail me at tairli@yahoo.com! My post solved your problem? This is my Paypal too :)
0 Likes
Tourist
5 0 2

This is the link that you get to when you select something from the collections page:

https://cardsofivalice.com/collections/lightning-1/products/2-097h

 

If you use this link, it appears the variant is actually considered selected and works as expected:

https://cardsofivalice.com/collections/lightning-1/products/2-097h?variant=33383842376

 

Is there a place to set a variant as "default" so it is selected from the collections that way?

0 Likes
Shopify Partner
2536 31 562

Yep, in some themes the variant is authomatically selected as soon as you arrive at the product page, so it is not important what's output in liquid, looks like your theme is different.

You can always reuse the original liquid code from the tutorial.

<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>

 

Want to hire me to tweak a theme? Mail me at tairli@yahoo.com! My post solved your problem? This is my Paypal too :)
0 Likes
Tourist
5 0 2

Thank you, that's what I will do.

0 Likes