displaying quantity remaining for variable product in Minimal theme

Highlighted
New Member
6 0 0

Please bear with me, I'm new to Shopify.  I have been researching this topic, and am now familiar with editing my theme.js and product-template.liquid.....but I just can't get this working.

I want to be able to show the remaining inventory quantity on a variable product.  Here is an example product from my page:

https://midwestmealworms.com/collections/mealworms/products/darkling-beetles

I've tried the suggestions from these threads:

https://community.shopify.com/c/Shopify-Design/How-to-add-quot-Quantity-left-quot-in-Minimal-theme/t...

https://community.shopify.com/c/Shopify-Design/Where-to-find-the-selectCallback-on-the-minimal-theme...

I have been able to get the remaining inventory quantity for the variable product when the page loads, but when I select other quantities the available doesn't update.  However, if I refresh, it will show correctly.  How do I get it to show dynamically without having to refresh the page?

Thank you in advance, if there is any additional information I can/should provide, please let me know.

Below is what I have in my product-template.liquid.  I do not have any changes in theme.js, nothing I do there seems to help.

 

 

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

    		<p>{{ variant.inventory_quantity }} left in stock.</p>
            
          </div>

 

 

0 Likes
Highlighted
New Member
6 0 0

Anyone able to offer advice or help?

0 Likes