fbpx
Want To Add Extra Images Per Product Variation For Free? Download Now

Replace Out of Stock red-X with icon?

Mark Robson

Hi

With out of stock option of set: Disabled Attribute style = Blur with cross

The product option has a red X overlaid.

Is it possible to replace the red cross with an icon?

Thx

 

Hakik Zaman

Hi Mark,

Thanks for reaching out to us. Yes, you can change it by adding the following code in Appearane > Customize > Additional CSS

.woo-variation-swatches .variable-items-wrapper .variable-item:not(.radio-variable-item).disabled .variable-item-contents:before, .woo-variation-swatches .variable-items-wrapper .variable-item:not(.radio-variable-item).disabled:hover .variable-item-contents:before {
background-image: url(YOUR_IMAGE_SOURCE); //Please use SVG format image here for better visibility
}

Thank You

Mark Robson

Hi Hakik

That’s perfect. Many thanks for supplying the CSS.

 

Mark