Button Customization for Out-of-Stock Products

[barisayarr]

Hello there

I am trying to customize the look of my website. On the product archive page, I changed the “Add to Cart” button color to orange.

My question is this:

For out of stock products; I want it to say “Out of Stock” instead of “Read More” and I want the button color to be gray. Is this possible?

Thank you.

• This topic was modified 1 year, 8 months ago by barisayarr.

Hi barisayarr,

Thanks for reaching to us and appreciate your patience.

1. Out of stock translation

In order to change / translate words. Please make sure you synced the strings first before changing / translating WooCommerce, WoodMart Core plugins and WoodMart theme. You can refer to article

https://xtemos.com/docs-topic/theme-translation/

2. Background color

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

div.wd-product.wd-hover-base .wd-bottom-actions:not(.wd-add-small-btn) div.wd-add-btn>a:not(.ajax_add_to_cart,.add_to_cart_button){
    background-color: #000;
}

Regards,

I’ve added that CSS to change the background colour but it doesn’t make any difference.

Hi vannquish,

Please provide URL of the mentioned page to the Private Content, so I can take a closer look.

Regards,

[Author]

Posts