Stock Urgency Labels - Gaurav Tiwari

The Stock Urgency Labels module displays warnings like “Only 3 left!” when product inventory runs low. It creates purchase urgency by making scarcity visible to shoppers.

Urgency Levels

The module uses three urgency levels based on stock quantity:

Level: In Stock | Default Threshold: Above low threshold | Visual Style: Green badge | Behavior: Optional, off by default
Level: Low Stock | Default Threshold: 5 or fewer | Visual Style: Amber/yellow badge | Behavior: Static display
Level: Very Low / Critical | Default Threshold: 2 or fewer | Visual Style: Red badge with pulse animation | Behavior: Animated to grab attention
Level: Out of Stock | Default Threshold: 0 | Visual Style: Red with strikethrough | Behavior: Shows out-of-stock message
Enabling the Module

Go to Fluent Cart > GT Extensions.
Toggle on Stock Urgency Labels.
Set your thresholds and message text.
Click Save Settings.

The module only works for products with stock management enabled in Fluent Cart. Products without stock tracking are ignored.

Settings

Low Stock Threshold — Quantity at which the low stock badge appears. Default: 5.
Very Low Threshold — Quantity at which the critical/very low badge appears. Default: 2.
Low Stock Text — Message template for low stock. Default: Only {count} left!. The {count} placeholder is replaced with the actual quantity.
Very Low Text — Message template for critical stock. Default: Almost gone! Only {count} left!.
In Stock Text — Message for in-stock products (only shown if the in-stock badge is enabled).
Show In-Stock Badge — Whether to display a badge when stock is healthy. Default: No.
Show on Archive — Display badges on product listing pages. Default: Yes.
Show on Single — Display badges on individual product pages. Default: Yes.

How It Works

The module registers these hooks:

fluent_cart/product/after_price (priority 15) — Injects the badge HTML after the price
fluent_cart/product_stock_availability — Adds urgency data to stock availability responses
fluent_cart/variation/data — Attaches urgency level and message to variation data
wp_footer — Outputs JavaScript for dynamic variation switching

Badge logic:

if stock == 0:         → out-of-stock (red, strikethrough)
if stock <= very_low:  → very-low (red, pulse animation)
if stock <= low:       → low (amber)
if show_in_stock:      → in-stock (green)
else:                  → no badge

Frontend Display

Badges are rendered as styled spans after the price:

<span class="gtfc-stock-urgency gtfc-urgency-low">Only 3 left!</span>
<span class="gtfc-stock-urgency gtfc-urgency-very-low">Almost gone! Only 1 left!</span>

Styling by Urgency Level

/* Low stock — amber */
.gtfc-urgency-low {
    background: #fef3c7;
    color: #92400e;
}

/* Very low / critical — red with pulse */
.gtfc-urgency-very-low {
    background: #fee2e2;
    color: #991b1b;
    animation: gtfc-pulse 2s infinite;
}

/* Out of stock — red, muted */
.gtfc-urgency-out-of-stock {
    background: #fee2e2;
    color: #991b1b;
    text-decoration: line-through;
}

/* In stock — green */
.gtfc-urgency-in-stock {
    background: #d1fae5;
    color: #065f46;
}

The pulse animation is a 2-second opacity cycle that draws attention to critically low stock items.

Dynamic Variation Updates

When a customer selects a different product variation, the badge updates automatically. The module’s JavaScript listens for the fluent-cart:variation-changed event dispatched by Fluent Cart’s Vue app.

When the event fires, the script:

Reads the new variation’s stock data
Determines the urgency level
Updates the badge HTML and CSS class
If the new variation is in stock and the in-stock badge is disabled, removes the badge

This ensures the urgency display always matches the currently selected variation.

Best Practices

Set thresholds that match your actual restock frequency. If you restock weekly, a threshold of 5 creates genuine urgency. If you restock daily, 2-3 is more appropriate.
Keep message text short and direct. “Only 3 left!” works better than “Hurry, there are only 3 items remaining in stock!”
Consider disabling the in-stock badge unless you have a specific reason to show it. Too many badges reduce their impact.