OUT OF STOCK BADGE IN SINGLE PRODUCT PAGE

This topic has 8 replies, 2 voices, and was last updated 3 years, 9 months ago ago by Olga Barlow

  • Avatar: joestam
    joestam
    Participant
    February 9, 2021 at 11:51

    Hello how can i show in the single product page the ”OUT OF STOCK” badge?
    It is only show in the shop page.
    Also how can i translate it to Greek? (ΕΞΑΝΤΛΗΜΕΝΟ)
    Thanks in advance

    Please, contact administrator
    for this information.
    7 Answers
    Avatar: Olga Barlow
    Olga Barlow
    Support staff
    February 9, 2021 at 13:39

    Hello,

    We added custom CSS to display it on the single product page over the product image.

    .single-product .label-product .out-stock {
        display: block;
        left: 20px;
    }

    Label translated, check now.

    Regards

    Avatar: joestam
    joestam
    Participant
    February 9, 2021 at 14:51

    Dear Olga thank you very much.
    Sorry i forgot it in my previous message, is it possible to change the Color to RED?
    Thanks again for your help

    Avatar: Olga Barlow
    Olga Barlow
    Support staff
    February 9, 2021 at 21:25

    Hello,

    Do you mean text color or bg color? Do you want to change it only on the single product or also at the shop page?

    Regards

    Avatar: joestam
    joestam
    Participant
    February 10, 2021 at 14:57

    Hello
    you are right, i want the BG color in the single product pages and also at the shop pages.
    Thanks

    Avatar: Olga Barlow
    Olga Barlow
    Support staff
    February 11, 2021 at 09:20

    Hello,

    Add the below custom

    .out-stock {
        background: red;
        width: auto;
        border-radius: 0;
        height: auto;
        margin: 0;
        transform: translate(-50%, -50%);
    }
    .out-stock .wr-c {
        margin: 10px;
        color: #fff;
        border-top-color: #ffffff82;
        border-bottom-color: #ffffff82;
    }

    Regards

    Avatar: joestam
    joestam
    Participant
    February 11, 2021 at 11:04

    Dear Olga i added the code but ONLY in the Single Product page the badge is OK.
    In the Home page and in the Category Page is out of the picture, please take a look at the screen prints.
    https://prnt.sc/z2tdeh
    https://prnt.sc/z2tk48
    Thank you

    Avatar: Olga Barlow
    Olga Barlow
    Support staff
    February 11, 2021 at 16:40

    Hello,

    Check now.

    Regards

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

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

8theme customization service

Helpful Topics

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