Sold out badge

Store Design
1

Hi there everyone,

I need to add the sold out badge on top of products which are sold out.

I removed the coding a few months ago that was pre built on the website.

Need to add it back lol.

Thank you

1 Like
2

www.unseengrail.com

3

South Africa

4

All I need is coding to plug onto my website. Never had to message over DM?

5

Hi @AI_CR7

Add this code and add the Sold out badge.

From your Shopify admin dashboard, click on “Online Store” and then “Themes”

Find the theme that you want to edit and click on “Actions” and then “Edit code”.

In the “theme. Liquid” file. Find the tag and paste the code below before the tag.

.card__media .card__badge.bottom.left {
    display: flex !important;
}

And save.

Result:

Made4uoRibe_0-1727962009384.png
Made4uoRibe_0-1727962009384.png652Ă—639 123 KB

Please don’t forget to Like and Mark Solution to the post that helped you. Thanks!

6

As you can see the button does appear but it doesnt say sold out’

7

Hi @AI_CR7

You also need to change the theme settings, under a badge block, a “Sold out badge color scheme” to not be white.

Currently, that is a white background and white text.

8

Check this this code is available in your card-product.liquid.


          {%- if card_product.available == false -%}
            
              {{- 'products.product.sold_out' | t -}}
            
          {%- elsif card_product.compare_at_price > card_product.price and card_product.available -%}
            
              {{- 'products.product.on_sale' | t -}}
            
          {%- endif -%}

If not you need to add this code.

9

Okay, I am in the exact same boat. I removed the badge with code a few months back and didn’t make note of how or where I did this, and now I would love to have the “sold out” badge back on my site. Can anyone help me?