A common WooCommerce request is “How do I add text before the price” or “Can I put text before the price when the product is on sale?”, so I decided to write a plugin to make that easier for people that don’t like getting dirty with code and function files and all that good stuff.
Download WooCommerce RRP
This is now available as a plugin from WordPress.org, download – WordPress RRP.
Possible Uses For Text Before The Price Include Displaying RRP, MSRP, SRP and Sale Price
The main use case for this plugin was to display RRP (recommended retail price), MSRP (manufacturer’s suggested retail price) or SRP (suggested retail price) and sale price, but really you can use it to display any text.
If you don’t want to use my plugin, that’s cool I guess, two ways you can do it:
- Write some PHP in your functions file, or
- Write some CSS in your style file
Option 1: Add Text Before The Regular And/Or Sale Price With Code
Here are three snippets of code you can use:
- First example give you the ability to add text before the regular price and sale price. You can change “RRP:” or “Sale Price:” to what you require
- Second example will allow you to change the text before the “Regular Price” only. You can change “RRP:” to what you require
- Third example allows you to change the text before the “Sale Price” only. You can change “Sale Price:” to what you require
Add text before regular price and sale price
function bd_rrp_sale_price_html( $price, $product ) {
if ( $product->is_on_sale() ) :
$has_sale_text = array(
'<del>' => '<del>RRP: ',
'<ins>' => '<br>Sale Price: <ins>'
);
$return_string = str_replace(array_keys( $has_sale_text ), array_values( $has_sale_text ), $price);
else :
$return_string = 'RRP: ' . $price;
endif;
return $return_string;
}
add_filter( 'woocommerce_get_price_html', 'bd_rrp_sale_price_html', 100, 2 );
Add text before regular price only
function bd_rrp_price_html( $price, $product ) {
$return_string = 'RRP: ' . $price;
return $return_string;
}
add_filter( 'woocommerce_get_price_html', 'bd_rrp_price_html', 100, 2 );
Add text before sale price only
function bd_sale_price_html( $price, $product ) {
if ( $product->is_on_sale() ) :
$return_string = str_replace( '<ins>', '<ins><br>Sale Price: ', $price);
return $return_string;
else :
return $price;
endif;
}
add_filter( 'woocommerce_get_price_html', 'bd_sale_price_html', 100, 2 );
Option 2: Use CSS To Add Text Before The Price
As all themes are a little different this exact CSS might not work, but hopefully you will get the idea on how you can do it and then apply it to the right selector on your theme. This technique uses the ::before selector that was introduced in CSS2, read all about it here.
Add text before the price on a product that is not on sale
.amount::before {
content: 'RRP:';
margin-right: 5px;
}
Add text before the sale price (ins) and before the regular price (del)
del .amount::before,
ins .amount::before {
margin-right: 5px;
}
del .amount::before {
content: 'RRP:';
}
ins .amount::before {
content: 'Now:';
}
And of course if you need to change the content you add for a specific product or category, you can using different CSS selectors, you might find some handy hints at the holy grail for WordPress info – Codex: Post Class
Ty Ricker says:
Your plugin is great. We moved to a Word Press MultiUser setup and with for some reason the plugin no longer worked?! 🙁
We were able to follow your instructions above.
Wanted a line break and added this:
del .amount::after {
content: “\000A”;
white-space: pre;
}
S1TE says:
Nice work Bradley,
This has helped alot on woocommerce development!
Kirill says:
You lost -‘- symbol in “Add text before sale price only” block, 6 line, after
gk says:
what part is that where i need to add the missing character
Bradley D says:
Pretty sure the example was updated gk.
Grzegorz says:
$retun_string should be $return_string = ‘RRP: ‘ . $price;
Janies says:
Thank you for this tutorial….worked like a charm on first trial !
Brad says:
Awesome, thanks for the feedback Janies
Janies says:
Quick question though….I put the words Starting at before my product prices and it worked fine. But I just realized that I have free products on my site too and obviously I don’t want the site to show Starting at for those items.
What code could I add to my files in order to hide Stating at for some products only?
Thanks for your help!
Janies says:
I did add this code in custom css :
.postid-15698 .price:before {
content:”Starting at: “;
}
and it works perfect BUT the “Starting at” only apperas in the product page itself and not on the shop page showing all my products. Is there a way to add the code for this specific product on the shop page?
Thank again!
Brad says:
Hi Janies,
On a category you will find that postid-15698 will just become post-15698 as part of a
Al says:
Hi if we were to add a shortcode like this [block id=”outofcali-free-tax”] before price, how would that be?
I tried content ” [block id=”outofcali-free-tax”]” but it failed.
Any suggestion?
Bradley D says:
Hi Al,
You will need to use the do_shortcode() function that is part of the WordPress API, see in the codex – https://developer.wordpress.org/reference/functions/do_shortcode/
Something like the following should work for you
function shortcode_rrp_price_html( $price, $product ) {
$retun_string = do_shortcode( ' [block id=”outofcali-free-tax”] ' ) . $price;
return $return_string;
}
add_filter( 'woocommerce_get_price_html', 'shortcode_rrp_price_html', 100, 2 );
Nandakumar says:
Hi Bradley,
My name is Nandakumar and I have an ecommerce affiliate portal running on Woocommerce. I wanted to change the Regular Price to something like Regular Price (MRP) and after the price is given, I wanted to have text “Inclusive of All Taxes” to be displayed after. I went through your article. It is very informative, but I am not sure to which functions file I need to changes, as I find many and where exactly the fucntions files and the css style sheet is located. Your help will be greatly appreciated.
Regards,
NandaaK
Bradley D says:
Hi Nandakumar,
These code snippets need to be placed in your themes function.php file. If you are not familiar with this file it can be harmful to the entire site if you make a mistake.
You could always use the following plugins:
– https://wordpress.org/plugins/woocommerce-rrp/ – for before the price
– https://wordpress.org/plugins/woocommerce-unit-of-measure/ – for after the price
Ben says:
I’m running the snippet in my functions and was wondering – how can I make it so the text only displays on single product pages but not main shop pages? I messed around with is_product() but couldn’t figure out how to implement it correctly.
Bradley says:
Hi Ben
Did you try is_single() and the product id? For example, if your WooCommerce product has an id of 17 and you want to add RRP, try doing it this way:
function bd_rrp_price_html( $price, $product ) {
if ( is_single( '17' ) ) :
$retun_string = 'RRP: ' . $price;
return $return_string;
endif;
}
add_filter( 'woocommerce_get_price_html', 'bd_rrp_price_html', 100, 2 );
Ben says:
I want to add the labels to every product but I only want them displayed on the actual product page, not on the main shop page or category pages. Does that make sense?
Bradley Davis says:
Hi Ben,
Oh right, my mistake, sorry about the confusion. So the last example without the id should do it, try the following and let me know how you go.
function bd_rrp_price_html( $price, $product ) {
if ( is_single() ) :
$retun_string = 'RRP: ' . $price;
return $return_string;
endif;
}
add_filter( 'woocommerce_get_price_html', 'bd_rrp_price_html', 100, 2 );
Ben says:
Thank you so much for the quick response! I tried adding that but it didn’t work out correctly, could you show me where to insert it into my snippet?
function bd_rrp_sale_price_html( $price, $product ) {
if ( $product->is_on_sale() ) :
$has_sale_text = array(
'
' => 'MSRP: ','' => 'Dealer: '
);
$return_string = str_replace(array_keys( $has_sale_text ), array_values( $has_sale_text ), $price);
else :
$return_string = 'Dealer: ' . $price;
endif;
return $return_string;
}
add_filter( 'woocommerce_get_price_html', 'bd_rrp_sale_price_html', 100, 2 );
Ben says:
That didn’t really translate properly but it’s the first snippet you posted earlier with my edit for the labels/titles.
Bradley says:
Hi Ben, Alright I think this might be what you are after, if the page is not a single product it just displays the price as normal, if it is a product and on sale it displays MSRP and Dealer and if it is a single product (not on sale) it displays Dealer.
function bd_rrp_sale_price_html( $price, $product ) {
if ( ! is_single() ) :
$price = $price;
elseif ( is_single() && $product->is_on_sale() ) :
$has_sale_text = array(
'
' => 'MSRP: ',
'' => '
Dealer: '
);
$price = str_replace(array_keys( $has_sale_text ), array_values( $has_sale_text ), $price);
else :
$price = 'Dealer: ' . $price;
endif;
return $price;
}
add_filter( 'woocommerce_get_price_html', 'bd_rrp_sale_price_html', 100, 2 );
oh crap, hopefully you read this after I fix the strikethrough text in the code. sorry about that.
Tito says:
It worked well for me! Thanks
Micke says:
Hello!
When I add this to my function.php in my childtheme in the Flatsome-theme, all the regular prices that has no sale-price set yet disappears:
function bd_rrp_sale_price_html( $price, $product ) {
if ( $product->is_on_sale() ) :
$has_sale_text = array(
‘
‘ => ‘RRP: ‘,” => ‘Sale Price: ‘
);
$return_string = str_replace(array_keys( $has_sale_text ), array_values( $has_sale_text ), $price);
else :
$retun_string = ‘RRP: ‘ . $price;
endif;
return $return_string;
}
add_filter( ‘woocommerce_get_price_html’, ‘bd_rrp_sale_price_html’, 100, 2 );
Nicole says:
return is spelt wrong
It is $retun_string = ‘RRP: ‘ . $price;
It should be $return_string = ‘RRP: ‘ . $price;
The variable name is spelt wrong so its not passing the price.
Bradley says:
Thank you Nicole, now updated.
Omar Alderete says:
Hello, is there a way to add the text to the product price by their tags? As in only products with certain tags will have the SRP prefix?
Bradley Davis says:
Hi Omar,
Not via the plugin, I will add this to the suggested list of features.
You could do this with some of the code examples above, with CSS you will probably find the tag gets added to the body tag so you could include that in the CSS selector and with PHP you do this with the has_tag I think.
With tags I guess the one thing you will need to pay attention to is if a product has two or more tags.
Cheers
Brad
Alvina says:
Why I am having error while running this code
function cw_change_product_price_display( $price ) {
$price .= ‘ At Each Item Product’;
return $price;
}
add_filter( ‘woocommerce_get_price_html’, ‘cw_change_product_price_display’ );
add_filter( ‘woocommerce_cart_item_price’, ‘cw_change_product_price_display’ );
I am trying to change the pricing on display but it gives me an unknown error. Can you please guide me how to change pricing? or Is there any alternative method to do this? I have seen this code here https://www.cloudways.com/blog/change-woocommerce-price-display/
Bradley Davis says:
Hi Alvina,
To add some text after the price you could just use a plugin that I have created for this very task – https://wordpress.org/plugins/woocommerce-unit-of-measure/
Luka says:
Is it possible to add text before the base price, too?
Bradley Davis says:
Hi Luka,
When you say “base price” are you referring to a composite product or something similar? I would say yes it is, however I do not have a composite product setup to test this out for you.
Jose Emanuel says:
Hi Bradley.
I have applied your codes to put text before and after the regular price and the sale price since I want to show a “before and after” in the prices along with a percentage and view of the money saved.
It works perfectly in normal products, but variable discount products do not work at all well, do you know what it could be?
I am trying to do just what appears in the image below::
https://i.stack.imgur.com/8Dkmb.jpg
Suresh Jain says:
I had installed Plugin and it shows as “MRP” – I need Just MRP.
Please Help !
When Entering MRP it shows as 1 in Product Page
michiel says:
Hi, could you tell me how to change the color of the text before the price, as well as the color of the price in your code of this function:
Add text before regular price and sale price
function bd_rrp_sale_price_html( $price, $product ) {
thanks!
Ness says:
Hi Bradley,
Thanks for making this useful plugin!!
Now my product pages, show the texts.
Any way to add this in the shop category pages?
Thank you
Mark Shade says:
I am trying to put the word “Delivered: ” in front of the price – but only on 2 categories (that already include shipping in the price). Whenever I try the original sample codes above, my page shows no price at all.
Any suggestions? Thanks!
sandy says:
Thank you so much! Worked like a charm
Cristihan Gonzalez says:
Hi,
I’d like to add “From: ” before the price of variable products on grid and product pages. Right now it is adding it to all products but I need to be only on variable products. This is the code i have in functions.php
function bd_rrp_sale_price_html( $price, $product ) {
if ( $product->is_on_sale() ) :
$has_sale_text = array(
‘
‘ => ‘From: ‘,” => ‘Sale Price: ‘
);
$return_string = str_replace(array_keys( $has_sale_text ), array_values( $has_sale_text ), $price);
else :
$return_string = ‘From: ‘ . $price;
endif;
return $return_string;
}
add_filter( ‘woocommerce_get_price_html’, ‘bd_rrp_sale_price_html’, 100, 2 );
Bradley Davis says:
Adding text to variable products is a little more complex, stay tuned.
Stephen says:
Nice plugin!
However, I’d like to display “From” on the shop page, and not on the product page.
At the moment, the plugin does the reverse.
Any suggestions, please?
Bradley Davis says:
One quick solution would be just to use a CSS solution, eg, ::before {content: “From “;} etc
Faustine Tan says:
Hi, Firstoff I need to Thank you for providing this coding.
I tried but as with others I tried earlier, instead of returning my Prefix : Now , Its returning / printing this : (as an example) — Double Prefix text…
Now Now $1.00
Any idea what’s happening? Thanks…
This is the coding I use which is the same as this page’s :
function fdev_regular_price_sale_price_html( $price, $product ) {
if ( $product->is_on_sale() ) :
$has_sale_text = array(
'
' => 'Now : ','' => ' Now : '
);
$return_string = str_replace(array_keys( $has_sale_text ), array_values( $has_sale_text ), $price);
else :
$return_string = 'Now : ' . $price;
endif;
return $return_string;
}
add_filter( 'woocommerce_get_price_html', 'fdev_regular_price_sale_price_html', 100, 2 );
Bradley Davis says:
Hi Faustine,
It looks like this would only be happening on an item with a sale price?
In your $has_sale_text array, do you have a value in your second key? In your comment, it looks like your second key is just an empty space, eg,
''
so the code will look for the first space and add in another “Now”. Update that second array key and let me know how that goes for you.Bradley
Andre says:
THANK YOU SO MUCH! How do we donate? Also, how did you change the font size of the RRP price and label and the font size of the sale price and label? Did you use css? If so what did you use and where would you paste it? Thanks again. Plugin works perfect. I would like to donate.