“out of stock” label display over product image

This topic has 2 replies, 2 voices, and was last updated 1 month, 2 weeks ago ago by Jack Richardson

  • Avatar: KikyoV
    KikyoV
    Participant
    July 9, 2026 at 04:22

    How to display “out of stock” label just like attached screenshot?
    My website just displaying it as text under product title. I want it to display over product image.

    Files is visible for topic creator and
    support staff only.
    1 Answer
    Avatar: Jack Richardson
    Jack Richardson
    Support staff
    July 9, 2026 at 10:24

    Dear @KikyoV,

    If you would like to display an “Out of Stock” label on the products listed on your shop page, you can enable this option here: https://gyazo.com/76577890257335edd6bdbf8da98d9b5f

    Please note that we do not provide an option to display this badge over the product image. This is due to UI/UX considerations, as the widget offers multiple options, and adding such a badge could cause conflicts with certain settings.

    Additionally, you may refer to the following discussion: https://www.8theme.com/topic/how-to-show-out-of-stock-on-image-in-archive-products-woocommerce-etheme_archive_products-default/#post-468132, where we have provided a custom CSS solution for displaying the “Out of Stock” label over the product image. However, this approach is not ideal due to structural limitations, so you may need to further customize the layout to suit your specific requirements.

    Kind regards, Jack Richardson
    The 8theme’s team

  • Viewing 2 results - 1 through 2 (of 2 total)

You must be logged in to reply to this topic.Log in/Sign up

We're using our own and third-party cookies to improve your experience and our website. Keep on browsing to accept our cookie policy.