Viewing 4 posts - 1 through 4 (of 4 total)
  • Author
    Posts
  • December 4, 2023 at 11:07 pm #1427168
    SHR Design

    Hi

    I added this PHP and CSS code. PHP Snippet 1.

    WooCommerce: Show “Sold Out” @ Shop Page

    Then set a product to 0. Stock Management is tracked.

    Blodbank

    Under the category: TROMBOCYTTINKUBATORER – (KLIMASKAP)
    Right clicked the product Climax 100. Noticed the code

    HTML Class soldout has been added.
    CSS has been added.

    .soldout {
    padding: 3px 8px;
    text-align: center;
    background: #222!important;
    color: #000!important;
    font-weight: 700;
    position: absolute!important;
    top: 6px;
    right: 6px;
    font-size: 12px;
    opacity: 1!important;
    display: block!important;
}

    Why is the black box sold out just seen for a moment before it goes away?
    What is going on?

    I have been down this road before in an earlier support thread in regards to a search in WooCommerce.

    December 5, 2023 at 6:35 am #1427188
    Ismael

    Hey Silje,

    Thank you for the inquiry.

    The “soldout” container is being covered by the product image. You need to increase the z-index to adjust the stack order of the element.

    .soldout {
    padding: 3px 8px;
    text-align: center;
    background: #222!important;
    color: #fff!important;
    font-weight: 700;
    position: absolute!important;
    top: 6px;
    right: 6px;
    font-size: 12px;
    opacity: 1!important;
    display: block!important;
    z-index: 100;
}

    Best regards,
    Ismael

    December 5, 2023 at 8:30 am #1427199
    SHR Design

    Thank you very much!
    I did not even think about the z-index. That worked well!

    December 6, 2023 at 2:46 am #1427284
    Nikko

    Hi SHR Design,

    I’m glad that Ismael could help you :)
    Thanks for using Enfold and have a great day!

    Best regards,
    Nikko

  • Author
    Posts
Viewing 4 posts - 1 through 4 (of 4 total)
  • The topic ‘Not able to see stock overlay badge in WooCommerce’ is closed to new replies.