Solved

How To Show Inventory Count On The Collection Page

jacksonroy03
Excursionist
24 0 6

I am trying to upgrade my company's website to a new free theme, Crave to be specific. On our old theme, we were able to show the inventory count left in stock on both the product page and the grid view. I was able to add a custom liquid block to the product page that shows the inventory count, but I can't find a relevant solution on the new themes to show the inventory count on the product grid view.

 

For example, if a customer is checking out one of our collections, they would need to click on the actual product to see how much is actually available. I would prefer to allow them to see how much is in stock without having to drill into the product page. Any help would be greatly appreciated 🙂

Accepted Solution (1)
joeeverett
Shopify Partner
19 4 5

This is an accepted solution.

Hi @jacksonroy03 

I hope this points you in the right direction. This shows the quantity of the first(default) variant of the product and it only shows if the quantity is greater than 0

The end result should look like this

Screenshot 2022-05-28 at 23.47.38.png

Go to Edit Code

Screenshot 2022-05-28 at 23.51.12.png

 

Scroll down to card-product.liquid

Screenshot 2022-05-28 at 23.51.40.png

add this line on line 33

 

{% assign firstVariant = card_product.first_available_variant %}

 

Screenshot 2022-05-28 at 23.57.44.png

 

 And add this on line 112

 

 {% if template.name == "collection" and firstVariant.inventory_quantity >= 1 %} <p>{{firstVariant.inventory_quantity}} product available</p> {% endif %}

 

Screenshot 2022-05-29 at 00.08.41.png

and then save

Screenshot 2022-05-29 at 00.00.39.png

 

 

View solution in original post

Replies 16 (16)

LitExtension
Shopify Partner
4860 1002 1135

Hi @jacksonroy03,

Can you send me the code and theme name, I will help you check it

LitExtension - Shopping Cart Migration Expert
Check out our Shopify migration app to migrate your online store to Shopify
jacksonroy03
Excursionist
24 0 6

Hi @LitExtension 

Thank you for replying to my message. I am trying to transition our site to the Crave theme. As far as the code goes, what section of the code do you need or am I able to send you everything? Sorry I am relatively new to the discussion platform and haven't shared our code before.

 

Not sure if you will be able to access, but here is the link to the code on the new theme: GRW Wine Collection ~ Edit ~ Crave 1.0 ~ Shopify

joeeverett
Shopify Partner
19 4 5

This is an accepted solution.

Hi @jacksonroy03 

I hope this points you in the right direction. This shows the quantity of the first(default) variant of the product and it only shows if the quantity is greater than 0

The end result should look like this

Screenshot 2022-05-28 at 23.47.38.png

Go to Edit Code

Screenshot 2022-05-28 at 23.51.12.png

 

Scroll down to card-product.liquid

Screenshot 2022-05-28 at 23.51.40.png

add this line on line 33

 

{% assign firstVariant = card_product.first_available_variant %}

 

Screenshot 2022-05-28 at 23.57.44.png

 

 And add this on line 112

 

 {% if template.name == "collection" and firstVariant.inventory_quantity >= 1 %} <p>{{firstVariant.inventory_quantity}} product available</p> {% endif %}

 

Screenshot 2022-05-29 at 00.08.41.png

and then save

Screenshot 2022-05-29 at 00.00.39.png

 

 

jacksonroy03
Excursionist
24 0 6

Hi Joe, thank you for this solution! Worked perfectly! If I wanted to also display this information on the featured collection, would I be able to use the same code? If so, where would I need to place it?

joeeverett
Shopify Partner
19 4 5

Hi @jacksonroy03 

 

I am glad that worked for you, if you change the line on 112 from

{% if template.name == "collection" and firstVariant.inventory_quantity >= 1 %}

 

to

 {% if firstVariant.inventory_quantity >= 1 %} 

 

It should also show on the featured collection.

jacksonroy03
Excursionist
24 0 6

Perfect, thank you for your help! This worked for me as well.

SaralHarrison
Visitor
2 0 0

@joeeverett Is this possible to do for ALL in stock not just the one variant? We can see the stock on the backend, I want my customers to be able to see total stock including all variants for a product. LMK! 

joeeverett
Shopify Partner
19 4 5

@SaralHarrison Hi Sara, unfortunately it takes a lot of customisation to achieve this. You can try this app which might help https://apps.shopify.com/gs-inventory-show-stock-level

SaralHarrison
Visitor
2 0 0

Interesting, so there is no way to code this and use something like "total stock"? I can see the total stock on the backend "11 in stock for 2 variants", it feels like there should be some way to point to this in the code? 

jlocklear146
Excursionist
18 0 7

This is excellent, thank you.

Can you share how this can be accomplished in the theme "Prestige"? 

Let me know if I should create a separate question for this.  Cheers.

joshjacobsen
Tourist
9 0 1

Hi @joeeverett - Thanks for your help here, might you have instructions on how to do this for theme Venue? 

zombiesinlondon
Excursionist
13 1 5

Would there be a way to display the inventory level on the individual product page too?  Maybe under the quantity selector?  I imagine it would be in the main-product.liquid but I'm struggling to figure out how to make it work.

jacksonroy03
Excursionist
24 0 6

@zombiesinlondon you can add a custom liquid section within your theme, after you click into any product, and then add the following code or something like it:

 

<p>Quantity In Stock: <strong>{{product.variants.first.inventory_quantity}}</strong></p>

ErSanjay
Shopify Partner
293 20 42

here code that will help you. 

 

 {% if current_variant.inventory_quantity >0 and current_variant.inventory_management == 'shopify' %}
            
             <p>Stock: {{ current_variant.inventory_quantity }}</p>
            
        
     
   {% endif %}
Business Owner & Shopify app developer - shopify consting - Full Stack Sofware Engineer
Er Sanjay
thelittlewolf
Visitor
2 0 0

Are there similar instructions for the spotlight theme?

LitExtension
Shopify Partner
4860 1002 1135

Hi @jacksonroy03,

Can you send me the code to show the inventory count left in stock? I will check it.

Or you can try to change the code for 'product grid view' as follows:

product => card_product

Hope it helps!

 

LitExtension - Shopping Cart Migration Expert
Check out our Shopify migration app to migrate your online store to Shopify