Adding a Low Stock Notifier on my Product Page.

[kustomfigz]

Hi im looking to add a Low in Stock when an item hits 2 units. Ive seen the code but i have no experience in coding, i wondered if anyone would be able to help me.

[Certified_Code]

Hi @kustomfigz , you can learn Velo with these resources: https://www.wix.com/velo/forum/getting-started/resources-to-learn-velo

the original code is:

import wixLocation from 'wix-location';

$w.onReady(function () {

    trackProductInventory();

    wixLocation.onChange(() => {
        trackProductInventory();
    })
});

async function trackProductInventory() {
    const product = await $w('#productPage').getProduct();
    const productQuantity = product.quantityInStock;

    if (product.inStock && productQuantity <= 10) {
        $w('#stockNotification').show();
    } else {
        $w('#stockNotification').hide();
    }
}

You can change this line from

    if (product.inStock && productQuantity <= 10) {

to

    if (product.inStock && productQuantity <= 2) {

So the case will be equal to or less than 2 stock unit.

P.S. Please do not directly copy the code as it may not work as expected. You can advise doing some modification based on your needs. - This forum is for learning, there won’t be any do-it-for-you-for-free services

[kustomfigz]

Thank you for your quick response, yeah i understand that i need to do it myself : ) just hard when had no experience. But thank you so much

[Certified_Code]

Hope you can find some success with Velo!

Btw,
If you are having difficulty with the code, you might want to consider looking for help on the Wix Marketplace , an online marketplace with top Velo web developers from around the world.

[Yose]

This post is a few years old, so there are a couple more options now for anyone else looking at this.

1. Use Velo (like above).
The Velo solution above should still work.

2. Use Wix’s built-in Low Stock message. (These steps are for Wix Studio, but they should be very similar in Wix Editor and Harmony.)
Wix has a built-in low stock indicator that appears below the quantity selector on the product page. By default it is enabled and shows when inventory drops below 10 items. It isn’t very obvious how to customize it in the editor, but here’s how:

1. Go to your wix editor → go to your Product Page → Change the product you’re viewing to one that is “low” (“low” defaults to less than 10 if you haven’t changed it)

2. In Settings, make sure Stock status is checked.

   

3. Click the “Only X left in stock” element to customize its design and change the inventory threshold that Wix considers “low”.

Note: This only appears on the Product Page and applies to all products by default. As far as I know, you can’t customize the text template (“Only X left in stock”), only the threshold and styling.

3. Use a third party app
If you want more flexibility, you can also use a third-party app. I built Better Product Labels, which automatically displays custom ribbons based on inventory rules (and other rules). For example, you can show “Low Stock”, “Only 3 Left”, “Selling Fast”, or any custom text on the Home page, Category page, and Product page, not just below the quantity selector.