I am struggling with this task and I could really use some help. First, before somebody marks this as an off-topic, I already did read all the questions and answers here and other sites as well. No luck.
I am trying to edit the HTML output of the wc_format_sale_price function located in wc-formatting-functions.php.
Original code is:
function wc_format_sale_price( $regular_price, $sale_price ) {
$price = '<del>' . ( is_numeric( $regular_price ) ? wc_price( $regular_price ) : $regular_price ) . '</del> <ins>' . ( is_numeric( $sale_price ) ? wc_price( $sale_price ) : $sale_price ) . '</ins>';
return apply_filters( 'woocommerce_format_sale_price', $price, $regular_price, $sale_price );
As you can see the prices are encapsulated in HTML elements <del>
and <ins>
.
I did tried to change the HTML directly and it works perfectly.
function wc_format_sale_price( $regular_price, $sale_price ) {
$price = '<div id="priceBefore" style="font-size: 16px;" class="old-price">' . ( is_numeric( $regular_price ) ? wc_price( $regular_price ) : $regular_price ) . '</div> <div id="priceAfter" style="font-size: 24px;" class="price">' . ( is_numeric( $sale_price ) ? wc_price( $sale_price ) : $sale_price ) . '</div>';
return apply_filters( 'woocommerce_format_sale_price', $price, $regular_price, $sale_price );
The thing is I don't want to change WC core files because it is a bad practice and the changes will be removed every time the shop owner updates the WC plugin. After some research I am sure that this should be done using filters in my theme's functions.php file but all the tutorials and articles about this functionality are quite messy. I did tried to follow few of them and I ended up with blank page, duplicate prices and stuff like that.
I understand that filters and actions are alpha and omega of Wordpress/Woocommerce theme development but my attempts to make them work were all just failures.