[SOLVED] Custom style for currency sign

[S@nya]

Hello, community!

Please help me with my issue:

 

On product page my prestashop displays price of the product in format "235 USD"

 

I need to make different colors and font size of number and currency sign. How can i wrap "USD" in separate <span> or <div>?

 

In classes/Tools.php there is a code which shows my price format

case 2:
$ret = number_format($price, $c_decimals, ',', ' ').$blank.$c_char;
break;

and in mytheme/js/tools.js 

if (currencyFormat == 2)
    return (formatNumber(price, priceDisplayPrecision, ' ', ',') + blank + currencySign);

in comments from this files, written that i have to modify both of them, so please tell me what changes i must to do?

[El Patron]

I don't think you  modify either of those files...

 

you would want to modify the .tpl file that displays the price

 

for example themes/yourtheme/product.tpl

[S@nya]

Hello El Patron, thanks for reply, but how can i separate price from currency sign wihtin .tpl file if variable which shows my price, looks like this {convertPrice price=$productPrice} and returns code like

<span id="our_price_display">150 USD</span> 

 on the page? But i need 

<span id="our_price_display">150 <span>USD</span></span>

I tried to change files from my first post like

case 2:
$ret = number_format($price, $c_decimals, ',', ' ').$blank. '<span>'.$c_char.'</span>';
break;

and 

if (currencyFormat == 2)
return (formatNumber(price, priceDisplayPrecision, ' ', ',') + blank '<span>'+currencySign+'</span>');

but no good result. Sometimes this changes makes error in console and brakes my ajax cart, sometimes just shows <span> like a simple text on the page. So may be you know some way to do it?

[Ronaldo Perez]

let's talk on English

 

- you can't use HTML in js formatCurrency, because in product.js we see 

$('#old_price_display').text(formatCurrency(...));

so here (and maybe in other places) this value using as text

 

possible solutions:

1. in CSS pseudo element  :first-letter can be used for $

2. parse this string in js something like 

$('#our-price').text().substr(0,1)...

3. Smarty have $currency and $product objects with all needed values 

[El Patron]

I apologize for my previous post.  I didn't read the post very well.  If you don't have this sorted out by the morning CST,  I will look more closely at the code.

 

Thanks Sergey for the help.   I am the oldest mod on the forum.

[S@nya]

Thanks all (и спасибо  ) for attention to my issue! I resolve it the way written by Kern from my topic in russian branch of forum, but i will translate to english, may be somebody will need it.

 

So, first in Tools.php before if ($no_utf8) paste the next string:

$c_char = '<span>'.$c_char.'</span>';

now, in Tools.js before if (currencyBlank > 0) paste this:

currencySign = '<span>' + currencySign + '</span>';

and the last step is changing ).text( to ).html( in mytheme\js\product.js everywhere in the strings with price_display.

 

Please, somebody mark it as RESOLVED

Edited September 21, 2013 by S@nya (see edit history)

[vekia]

thanks for solution and of course im going to mark this topic as solved exactly as you suggested.

btw. you can achieve this with js library: lettering.js

with this library you can use css styles like span::last-word, if you or someone else are interested, more informations here: http://letteringjs.com/

[S@nya]

Thanks vekia, very useful thing, i think it will be good for one of my projects.