How To Mark Product Sold out on Shopify

1. Use Shopify’s built in Inventory management.
2. Manually add Sold out text in product title or badges.
3. Install Shopify Apps for Sold out labels.

Method 1: Use Shopify’s built in inventory management

In this method You can manage the product inventory directly from the Shopify Admin. If inventory is less than the threshold then most Shopify website automatically show sold out basge to the product items. If this feature is not avaible in your theme then you have to use some alternate approach like using custom coding.

Step 1: Navigate to Shopify admin > Products.

Step 2: Select the product you want to update.

Step 3: Scroll down to the inventory section.

Step 4: Check track quantity.

Step 5: Set the quantity to 0 for all possible locations.

Step 6: Optional Uncheck continues selling when out of stock to prevent backorders.

Note: Shopify will automatically show the Sold out label or disabled the Add to Cart button depending on the theme.

Method 2: Manually add Sold out text in product title or badges

In this method you can show the sold out lable in your product title or as a badge in the product list in your desired location using custom coding. Custom coding gives you the full control over badges placement and style according to your branding. Sold out badge clearly tells the customers that this product is currently not available to increase user's trust and increase conversions. This process is useful when you want to visually mark the products as sold out. Here is the final result, check the GIF below to see how it will look before we go through the steps.

There are two possible ways of doing that.

1. Add Sold out in Product title.
2. Disable the add to cart button when sold out.
3. Use Product Tags.

1. Add Sold out in Product Title

If your theme does not support a sold out label then you can add this using liquid. Follow these steps to add a sold out label in the product title using Liquid.

Step 1: Navigate to Online Store > Themes > Edit code.

Step 2: Go to the product-item.liquid or card-product.liquid file depending on the theme.

Step 3: Search for the area where you want to add a sold out label.

Step 4: Add this code at the beginning or end of the product title.

  
    {% if product.available == false %}
        <span class="sold-out-badge">Sold Out</span>
    {% endif %}
  

Step 5: Add CSS to style the sold out badge in your stylesheet file at the end like theme.css or base.css.

  
    .sold-out-badge {
        position: absolute;
        top: 10px;
        left: 10px;
        background-color: #e74c3c;
        color: white;
        padding: 5px 10px;
        font-size: 12px;
        text-transform: uppercase;
        z-index: 2;
        border-radius: 3px;
    }
  

Step 6: Click Save.

2. Disable add to cart button when Sold out

Most Shopify Themes automatically disable the add to cart button if product is sold out. If your theme does not support that then you can do that using liquid. Follow these steps for step by step process to enable that in your theme.

Step 1: Navigate to Online store > Themes > Edit code

Step 2: Go to the main-product.liquid file.

Step 3: Go to the product form section where the add to cart button exists in your file and add this code. Something like that and style appropriately according to your branding.

  
    {% if product.available %}
        <button type="submit" class="btn">Add to Cart</button>
    {% else %}
        <button type="button" class="btn disabled" disabled>Sold Out</button>
    {% endif %}
  

This product variable can be different based on the reference for example if you use code {% render ‘card-product’. product: product %} like this in your product loop  then use this code. 

  
    {% render ‘card-product’. product: product %}  then use this code
    {% if product.available %}
        <button type="submit" class="btn">Add to Cart</button>
    {% else %}
        <button type="button" class="btn disabled" disabled>Sold Out</button>
    {% endif %}
  

If you use this in your product loop {% render ‘card-product’. card-product: product %} then use this code.

  
    {% render ‘card-product’. card-product: product %}  then use this code
    {% if card-product.available %}
        <button type="submit" class="btn">Add to Cart</button>
    {% else %}
        <button type="button" class="btn disabled" disabled>Sold Out</button>
    {% endif %}
  

Step 4: click Save.

3. Use Product Tags

You can also add product tags like sold out in the product that has inventroy of 0. Show the tag using liquid in the storefront so that user can clearly see the sold out products. Also this can be helpful to sort the products based on the tags in the collection pages in Shopify. To add product tags and to show the soldout label follow these steps.

Step 1: Navigate to Shopify Admin  > Products

Step 2: Select the product you want to update.

Step 3: Scroll down to the Product tags section.

Step 4: Add the sold out tag and click Save button.

Step 5: Go to the product-item.liquid or card-product.liquid file depending on the theme.

Step 6: add this code in your desired location

  
    {% if card_product.tags contains 'sold out' %}
        <span class="sold-out-badge">Sold Out</span>
    {% endif %}
  

Step 7: Click Save button.

Method 3: Use Shopify Apps for Sold out Badges

You can install apps from Shopify app store to add Sold out badges by using apps without any coding knowledge. There are many Shopify Apps available for that purpose. Simply install the app of your choice and configure it with the guide provided. Steps can vary from app to app. Here is the final result, check the GIF below to see how it will look before we go through the steps.

Step 1: Navigate to Shopify Admin > Apps

Step 2: Click on All recommended apps button here.

Step 3: Navigate to the Shopify app store using this link.

Step 4: Search for the app you want to add eg.DECO Product Labels & Badges app.

Step 5: Click on the install button.

Step 6: Click Install in the Shopify Admin

Step 7: Click on the quick add label button.

Step 8: Select the type of label Image label or Text label.

Step 9: Add background color according to your requirements.

Step 10: Add dynamic label based of the variables available or using metafields 

Step 11: Customize other settings like text size , color location of label to appear for example on product, collection page etc. you can also show or hide on desktop and mobile as well.

Step 12: select the product where you want to show the label.

Step 13: Click Save.

Step 14: Click on App embed.

Step 15: Click Save. 

Some popular Apps are listed here.

1. DECO Product Labels & Badges

2. TA Product Labels & Badges

3. Sami Product Labels & Badges

For more theme customization tricks, check our article on how to add schema markup to Shopify.

Conclusion 

Clear “Sold Out” labels help create a smoother shopping experience and build trust with your visitors. They also prevent confusion and reduce the chance of customers getting frustrated by trying to buy something that’s no longer available.

Shopify makes it easy to show “Sold Out” messages in different ways. You can set it up using Shopify’s built-in settings, add a small piece of custom code, or use a helpful app. Each option has its benefits, and you can choose what works best for your store’s design and your comfort level with tech.

If you're unsure which method to use or need help setting it up just right, don’t worry, we’ve got you covered.

Our team at Ecomx Agency is here to help!