A user seeks to add a ‘low stock’ badge to product cards in Dawn theme’s collection view, similar to existing ‘sold out’ and ‘on sale’ badges. The goal is to display inventory warnings like ‘1 left’ when stock is limited.
Solution Approaches:
Code-based method: Modify card-product.liquid by adding conditional logic that checks card_product.inventory_quantity. Example code provided shows displaying ‘Only 1 left!’ when inventory equals 1, and ‘Few left!’ for quantities between 2-10.
Automation option: Use Shopify Flow to automatically tag products based on inventory levels, which can trigger badge displays and enable creation of low-stock collections.
App alternative: The Product Badges app offers a no-code solution with inventory variables and customizable display rules.
Implementation Note:
The code snippet must be placed where existing badges are located (search for ‘card__badge’ in the file), not at the bottom of card-product.liquid. One user encountered issues with incorrect placement and received guidance on proper positioning.
On my current Dawn theme, Shopify will add a button to the gallery view of my collection when a product is either ‘sold out’ or ‘on sale’.
I’d also like to have the ability to have a ‘low stock’ flash/button or, better yet, to display the quantity saying ‘1 left’ etc, when I only have a couple left.
Can anyone please advise if this would be easy to implement?
Many thanks
Lindsey
Hi Lindsey,
This feature is definitely doable, and the exact implementation will depend on your store’s setup.
A couple of weeks ago, I implemented something similar for a client with around 1500 products, and it worked quite seamlessly. Here’s how I approached it:
Reuse Code for Existing Badges
Since Dawn already has badges for “Sold Out” and “Sale,” I copied the code and added a new badge for inventory. I wrapped it in an if statement that checked the total inventory for the product.
Use Shopify Flow for Automation
I set up Shopify Flow to automatically update the tags based on inventory. For example:
If you’d like, I can guide you through the setup or help with the code adjustments. Let me know if you’d like to explore this approach further! 
Hi Lindsey,
This feature is definitely doable, and the exact implementation will depend on your store’s setup.
A couple of weeks ago, I implemented something similar for a client with around 1,500 products, and it worked seamlessly.
Since Dawn already has badges for “Sold Out” and “Sale,” I extended that logic by adding a “Low Stock” badge to display inventory levels.
In card-product.liquid, you could add something like this:
{%- if card_product.inventory_quantity == 1 -%}
<span
id=“NoMediaStandardBadge-{{ section_id }}-{{ card_product.id }}”
class=“badge badge–bottom-left color-{{ settings.sale_badge_color_scheme }}”
Only 1 left!
{%- elsif card_product.inventory_quantity > 1 and card_product.inventory_quantity <= 10 -%}
<span
id=“NoMediaStandardBadge-{{ section_id }}-{{ card_product.id }}”
class=“badge badge–bottom-left color-{{ settings.sale_badge_color_scheme }}”
Few left!
{%- endif -%}
If you want to use low-stock products in additional ways (like creating a specific collection, etc.), you can also trigger the inventory badge by using tags. With Shopify Flow, it’s quite easy to automate the tagging and ensure your collections are always up to date.
This gives you an idea of how to approach the problem while allowing flexibility in how you structure the code. If you’d like, I can guide you through the setup or help with the code adjustments. Let me know if you’d like to explore this approach further!
Hi Lindsey,
This feature is definitely doable, and the exact implementation will depend on your store’s setup.
Since Dawn already has badges for “Sold Out” and “Sale,” I simply copied the code “Low Stock.” and added another one for the inventory. I wrapped the new badge within an if statement that was looking up the inventory.
In “card-product-liquid” you could add:
{%- if card_product.inventory_quantity == 1 -%}
<span
id=“NoMediaStandardBadge-{{ section_id }}-{{ card_product.id }}”
class=“badge badge–bottom-left color-{{ settings.sale_badge_color_scheme }}”
Only 1 left!
{%- elsif card_product.inventory_quantity > 1 and card_product.inventory_quantity <= 10 -%}
<span
id=“NoMediaStandardBadge-{{ section_id }}-{{ card_product.id }}”
class=“badge badge–bottom-left color-{{ settings.sale_badge_color_scheme }}”
Few left!
{%- endif -%}
Please let me know if you’d like me to guide you through the setup or help with the code adjustments.
Hi @LindseyNewns ,
I will guide you through the steps to use the Product Badges app:
Step 1: Install the app and enable the app embed feature.
Step 2: Create and customize a label that matches your brand. Use the variable {inventory} to display inventory-specific content.
Step 3: In the Product Settings section, set the Inventory Status rule to display the label only when your products have 1–x items in stock.
Step 4: Choose which collections and pages to display on
Hey, this doesnt work for me, i pasted it on the bottom of the card-product code
I need some help please
It’s not supposed to go at the bottom of the file.
For the “inventory badge” to show correctly, the code needs to be placed where the other badges are located.
Please search for “card__badge" in the file, and you should be able to see where/how to paste the code the code.
If you need any help with this, let me know, and we can potentially have a look at it.
