Home › Forums › WoodMart support forum › Out of stock / Sold out overlay badge

Out of stock / Sold out overlay badge

Viewing 10 posts - 1 through 10 (of 10 total)
  • Author
    Posts
  • September 5, 2020 at 9:16 pm #223939

    m76market
    Participant

    Hi,

    Is it possible to have the “Sold Out” label in the product gallery displayed as the attached image?

    Thanks

    Attachments:
    You must be logged in to view attached files.
    September 6, 2020 at 11:32 am #224021

    Elise Noromit
    Member

    Hello,

    Please provide the page URL with the label and specify where do you want to have such a label: on the product grid or on the main product page?

    Best Regards

    September 6, 2020 at 3:04 pm #224032

    m76market
    Participant

    Hi,

    I am referring to the product grid:
    https://woodmart.xtemos.com/shop/

    Thanks,
    Marco

    September 6, 2020 at 4:27 pm #224049

    Elise Noromit
    Member

    Hello,

    Please provide your page URL or screen. There are two types of labels: rounded and rectangular. I need to see that to provide you with custom CSS.

    Best Regards

    September 8, 2020 at 12:57 pm #224605

    m76market
    Participant

    Hi,

    please see the attached file, I have the SOLD label on the upper left and I would like to have it as described.

    Another topic, you see that the label doesn’t have the background color; Not sure if it is as default or it is a configuration error, but I would like the system background color for the “SOLD” label on the product page. For your information, I changed the term from Sold Out to Sold with “Loco Translate”

    Attachments:
    You must be logged in to view attached files.
    September 9, 2020 at 6:52 am #224766

    Elise Noromit
    Member

    Hello,

    Please add this code to the Theme Settings > Custom CSS > Global:

    .product-grid-item.outofstock .product-labels {
  left: 0;
  right: 0;
  top: 50%;
  transform:translateY(-50%);
  max-width: 100%;
}
.product-grid-item.outofstock .out-of-stock {
  width: 100%;
  max-width: 100%;
  border-radius: 0;
}
.product-grid-item.outofstock .product-label:not(.out-of-stock) {
  display: none;
}

    Best Regards

    September 9, 2020 at 8:08 am #224782

    m76market
    Participant

    Hi,

    Perfect it solved my rquest, I am loving your theme.
    One last point, in the product page I have the cicular label “SOLD” without the system (green) background color. Please see the link copy in the private content.
    Could you please tell me how to set the background color for the “Sold” label?

    Many thanks,
    Marco

    September 9, 2020 at 10:15 am #224828

    Elise Noromit
    Member

    Hello,

    Please add this code to the Theme Settings > Custom CSS > Global:

    body.single .labels-rounded .out-of-stock {
    background-color: red;
}

    Replase “red” with your color.

    Best Regards

    September 9, 2020 at 10:55 am #224849

    m76market
    Participant

    Perfect, thank you very much again for the help.

    September 9, 2020 at 2:25 pm #224922

    Elise Noromit
    Member

    You are welcome! If you have any questions please feel free to contact us.

    Best Regards

  • Author
    Posts
Viewing 10 posts - 1 through 10 (of 10 total)

The topic ‘Out of stock / Sold out overlay badge’ is closed to new replies.