Hi Scopieg,
I had these working a while ago, so not sure after all the big updates of Woocommerce this will work but you can give it a try:
Change the colour of the badge:
open child theme style.css and change the colour #edfcd5 in the example to the colour you would like:
.woocommerce span.soldout, .woocommerce-page span.soldout {
background: #edfcd5;
}
To move button the bottom right add the following css to your theme’s custom.css file ( best child theme otherwise it will be overwritten in the next updates )
.woocommerce span.soldout, .woocommerce-page span.soldout {
bottom: 0;
}
Good luck,
Annie
Thread Starter
scopie
(@scopieg)
Yes! Thank you! That worked perfectly! Is there a way to make the font larger?
Good to hear it helps!
To change the text please add the following code to your theme’s functions.php file:
add_filter( ‘woocommerce_sold_out_flash’, ‘wc_custom_sold_out_flash_text’ );
function wc_custom_sold_out_flash_text( $text ) {
return sprintf( ‘<span class=”soldout”>%s</span>’, __( ‘My New Text’, ‘wc-sold-out-products’ ) );
}
Replace My New text with whatever you like!
I will look if I find how to make the font larger.
I assembled all Gerhards info in a document, will get back if I found what you are asking.
Annie
Sorry for now cant seem to find the way to make the font larger.
I am not sure but I think this could be done in theme options, if you are using by any chance the Woothemes Canvas theme, otherwise I would not know a solution for that….
Good luck,
Annie
Thread Starter
scopie
(@scopieg)
Thank you so much for your replies! I’ll give it a try!
Happy to know its resolved.
Did you find where how to change the font as well, and if so please tell I forgot to write that down?
Thx,
Annie
Thread Starter
scopie
(@scopieg)
No, Annie, I didn’t figure out how to change the font size. I’m not much of a programmer. But the info that you gave me on how to replace the image is really what I wanted.
Hi Scopieg,
Ok, I have know this but can not seem to find it again, I dont need it for now but might in the future.
Anyhow, glad the information helped!
Annie
Change text size with this example. put code in your custom CSS
.out-of-stock{
font-size: 1.92em!important;
}
