Decimal case number’s style
-
Hello, I use WooCommerce + Storefront theme and I would like to know how I can edit via CSS only decimal cases of my numbers: $ 11.55 is my price. How can I make “55” smaller?
We need that because here in Brazil numbers after decimal case are not a huge deal, but I also need to show them, I could not use the option to hide them.
Thanks a lot
-
To be able to format the centavos, you’ll need to put a span with a class round them. Try this function:
add_filter( 'wc_price', 'my_price', 3, 60 ); function my_price( $return, $price, $args ) { // $return = price with currency symbol // $price = price as a number // $args = array (inc tax, exc tax) $reals = intval( $price ); $centavos = $price - $reals; // ensure $centavos has 2 characters $centavos_str = str_pad( $centavos, 2, '0' ); return 'R$'.$reals.'.<span class="centavos">'.$centavos_str.'</span>'; }The code goes in your child theme’s functions.php or, if you don’t have a child theme, you can use the “My Custom Functions” plugin.
Now you can control the centavos font size with custom css:
.centavos { font-size:12px; }Custom css can be entered at:
Dashboard > Appearance > Customise > Additional CSSNot tested exhaustively.
-
This reply was modified 8 years, 11 months ago by
Peter Lawrenson.
Awesome! It is working, but in Brasil we use comma before centavos. Like: R$ 11,55
My whole site is with dots right now.I also could edit before: “woocommerce-Price-currencySymbol” “R$” It disapeared with your code. And after the currency symbol I had a space, right now it is together with the number.
Whey are seem very simple to solve, but I am not good with codes.
Thanks a lot @Iorro!
Change the return line to:
return 'R$ '.$reals.',<span class="centavos">'.$centavos_str.'</span>';Nice!
I just can’t style the “R$” anymore. I tryed the following but it did not work:
add_filter( 'wc_price', 'my_price', 3, 60 ); function my_price( $return, $price, $args ) { // $return = price with currency symbol // $price = price as a number // $args = array (inc tax, exc tax) $reals = intval( $price ); $centavos = $price - $reals; // ensure $centavos has 2 characters $centavos_str = str_pad( $centavos, 2, '0' ); return <span class="cifrao">'R$ '</span>.$reals.',<span class="centavos">'.$centavos_str.'</span>'; }Punctuation is fussy!
return '<span class="cifrao">R$ </span>'.$reals.',<span class="centavos">'.$centavos_str.'</span>';This service will help check your syntax:
http://phpcodechecker.com/You are great. Thank you so much!
Solution:
add_filter( 'wc_price', 'my_price', 3, 60 ); function my_price( $return, $price, $args ) { // $return = price with currency symbol // $price = price as a number // $args = array (inc tax, exc tax) $reals = intval( $price ); $centavos = $price - $reals; // ensure $centavos has 2 characters $centavos_str = str_pad( $centavos, 2, '0' ); return '<span class="cifrao">R$ </span>'.$reals.',<span class="centavos">'.$centavos_str.'</span>'; }@lorro I needed to follow up here. The above code had one problem. It shows “00” for all my centavos. The problem is with my WooCommerce configs. My prices are like this: R$ 12,66. When we pull the string “$price” on the code above it pulls: “R$ 12.66” so the result of “$centavos” = 12.66 – 12 = 0
I really don’t know why, but It is always zero, I guess it is because the “mess” of dots and commas. So the only way I could make it work is going to (www.mysite.com.br/wp-admin/admin.php?page=wc-settings) and:Leave “woocommerce_price_thousand_sep” empty (it was “.” before)
Put “.” on “woocommerce_price_decimal_sep” (it was “,”before)And change the code to:
add_filter( 'wc_price', 'my_price', 3, 60 ); function my_price( $return, $price, $args ) { // $return = price with currency symbol // $price = price as a number // $args = array (inc tax, exc tax) $reals = intval( $price ); $centavos = floor( ($price - $reals)*100 ); // ensure $centavos has 2 characters $centavos_str = str_pad( $centavos, 2, '0' ); return '<span class="cifrao">R$ </span>'.$reals.',<span class="centavos">'.$centavos_str.'</span>'; }Do you think this is OK?
Or can I make it better and change WooCommerce Configs back to Brazilian standard?I would go back to Brazillian standard, then inside the function, use str_replace to change the comma to a point so you can do arithmetic on it:
add_filter( 'wc_price', 'my_price', 3, 60 ); function my_price( $return, $price, $args ) { $price = str_replace( ',', '.', $price ); $reals = intval( $price ); $centavos = ( $price - $reals ) * 100; $centavos_str = str_pad( $centavos, 2, '0' ); return 'R$'.$reals.'.<span class="centavos">'.$centavos_str.'</span>'; }-
This reply was modified 8 years, 11 months ago by
Peter Lawrenson.
I added str_replace for dots and commas, as we have both in Brazil. I also added them back to price after the arithmetic was done, but I lost the thousand separator (1.000,55 in Brazil) Now when I have thousands it shows 1000,55, but I think this is not a problem at all.
My code, thanks to you!:
add_filter( 'wc_price', 'my_price', 3, 60 ); function my_price( $return, $price, $args ) { $price = str_replace( '.', '', $price ); $price = str_replace( ',', '.', $price ); $reals = intval( $price ); $centavos = round( ( $price - $reals )*100 ); $centavos_str = str_pad( $centavos, 2, '0' ); $price = str_replace( '.', ',', $price ); return '<span class="cifrao">R$ </span>'.$reals.'<span class="centavos">,'.$centavos_str.'</span>'; }-
This reply was modified 8 years, 11 months ago by
Ricardo.
-
This reply was modified 8 years, 11 months ago by
The topic ‘Decimal case number’s style’ is closed to new replies.