Show sold out badge to WooCommerce Store

If you are looking for a sold out badge for WooCommerce store out of stock products without a plugin, you are at the right place. Keep going through the article to easily accomplish your goal.

A nice ‘sold out’ badge on products image, on the shop page or product category archives will look great. We can achieve that using woocommerce_before_shop_loop_item_title hook and some css.

function careless_display_woocommerce_sold_out_badge() {
    global $product;
    if ( ! $product->is_in_stock() ) {
        echo '<span class="soldout">Sold Out</span>';
add_action( 'woocommerce_before_shop_loop_item_title', 'careless_display_woocommerce_sold_out_badge' );

This will show the “Sold Out” text right above the product title. We will place it on top of the product image with the help of some css.

.soldout {
    padding: 10px 20px 10px 20px!important;
    text-align: center;
    background: #000000;
    color: white;
    position: absolute;
    top: 10px;
    font-size: 20px;
    font-weight: 500;

This is how it looks on strofront theme:

woocommerce sold out badge

Code goes in the functions.php file of your active theme. And css goes in your style.css file or in your theme options (if it has an option add css).

Note: Above method does not work on search results. Follow this article to show sold out badge on WooCommerce search result.