To add a winter sale or Winter Bash badge we added this script to our must use plugin

// Hook into the 'wp_enqueue_scripts' action
add_action( 'wp_enqueue_scripts', 'custom_scripts' );
add_filter('woocommerce_sale_flash', 'woocommerce_custom_sale_text', 10, 3);
function woocommerce_custom_sale_text($text, $post, $_product)
{
return 'Winter Bash';
}

It basically adjusts the WooCommerce Sales badge text with the text added. This will apply to to all products on sale so if this was only needed for a specific product you will need to add a conditional block to wrap this filter in.

To add some fancier CSS to rotate the badge and show in attached to the corner of the product featured image move it to the right we used

/* Sales Badge */
.single-product #-product-images-186-10168 span.onsale {
padding-top: 15px;
padding-left: 50px;
padding-right: 50px;
padding-bottom: 15px;
background-color: #006437;
font-size: 16px;
border-radius: 0px;
position: absolute;
left: 460px;
width: 200px;
transform: rotate(45deg);
}

You probably need to change the selectors here of course. This as we used a general WooCommerce class followed by an Oxygen Builder class.

Also see https://www.cloudways.com/blog/change-sale-badge-text-in-woocommerce/ for basic setup.

Recommended Posts

No comment yet, add your voice below!


Add a Comment

Your email address will not be published. Required fields are marked *