productprice - smaller font behind the comma

[jwd19]

Dear,

 

Can someone help me to get the numbers behind the comma in a smaller font ?

 

i mean the following:  12,99  (the ,99 should be in a smaller adjustable size.

 

How can i do this ?

 

Kindest regards!

[rocky]

It's hard to help without actually seeing the code you want to change. Let's say you have a variable {$product->price} that contains 12,99. You can use code like the following to display the 99 in a smaller font:

{$product->price|replace:',':',<sup>'}</sup>

[jwd19]

Dear Rocky

 

I use prestashop 1.6.1.7. i cant find your code in product.tpl.

How can i use your code ? can you please be more detailed, i am not an expert

 

Kindest regards!

[rocky]

I've tried to come up with the simplest solution I can so it will be easier to implement. Create override/classes/Tools.php with the following:

<?php

class Tools extends ToolsCore
{
    public static function displayPrice($price, $currency = null, $no_utf8 = false, Context $context = null)
    {
        if (!is_numeric($price)) {
            return $price;
        }

        $price = parent::displayPrice($price, $currency, $no_utf8, $context);

        if (!$context) {
            $context = Context::getContext();
        }
        if ($currency === null) {
            $currency = $context->currency;
        } elseif (is_int($currency)) {
            $currency = Currency::getCurrencyInstance((int)$currency);
        }

        if (is_array($currency)) {
            $c_format = $currency['format'];
        } elseif (is_object($currency)) {
            $c_format = $currency->format;
        } else {
            return false;
        }

        $decimal_char = '';

        switch ($c_format) {
            case 2:
            case 3:
                $decimal_char = ',';
                break;
            default:
                $decimal_char = '.';
        }

        $price = str_replace($decimal_char, '<sup>', $price);
        
        if (strpos($price, '<sup>') !== FALSE)
            $price .= '</sup>';
        
        return $price;        
    }
}

Remember to go to Advanced Parameters > Performance and click the "Clear cache" button (or manually delete cache/class_index.php) so PrestaShop can find the override. This will remove the decimal character from all prices and make the numbers after the decimal character superscript.

 

Unfortunately, it won't affect prices that are formatted using JavaScript. That will require more work. You'll need to change line 56 of js/tools.js from:

	return abs_val_string + virgule + (deci_string > 0 ? deci_string : '00');

to:

	return abs_val_string + '<sup>' + (deci_string > 0 ? deci_string : '00') + '</sup>';

This will add the superscript tag, but it will converted to text in product.js, so you'll need to change all the text() function calls to html() function calls. There's a lot to change, but they are easy to change since you're making the same change to each line.

 

For example, change line 297 of themes/default-bootstrap/js/product.js from:

			$('#our_price_display').text(formatCurrency(parseFloat($('#our_price_display').attr('content')), currencyFormat, currencySign, currencyBlank));

to:

			$('#our_price_display').html(formatCurrency(parseFloat($('#our_price_display').attr('content')), currencyFormat, currencySign, currencyBlank));

and line 805 from:

      $('#our_price_display').text(findSpecificPrice()).trigger('change');

to:

      $('#our_price_display').html(findSpecificPrice()).trigger('change');

and line 808 from:

      $('#our_price_display').text(formatCurrency(priceWithDiscountsDisplay, currencyFormat, currencySign, currencyBlank)).trigger('change');

to:

      $('#our_price_display').html(formatCurrency(priceWithDiscountsDisplay, currencyFormat, currencySign, currencyBlank)).trigger('change');

and line 813 from:

		$('#our_price_display').text(formatCurrency(0, currencyFormat, currencySign, currencyBlank)).trigger('change');

to:

		$('#our_price_display').html(formatCurrency(0, currencyFormat, currencySign, currencyBlank)).trigger('change');

and line 821 from:

		$('#old_price_display span.price').text(formatCurrency(basePriceDisplay, currencyFormat, currencySign, currencyBlank));

to:

		$('#old_price_display span.price').html(formatCurrency(basePriceDisplay, currencyFormat, currencySign, currencyBlank));

and line 856 from:

		$('#ecotax_price_display').text(formatCurrency(ecotax * currencyRate, currencyFormat, currencySign, currencyBlank));

to:

		$('#ecotax_price_display').html(formatCurrency(ecotax * currencyRate, currencyFormat, currencySign, currencyBlank));

and line 804 from:

		$('#unit_price_display').text(formatCurrency(unit_price * currencyRate, currencyFormat, currencySign, currencyBlank));

to:

		$('#unit_price_display').html(formatCurrency(unit_price * currencyRate, currencyFormat, currencySign, currencyBlank));

and line 945 from:

			$(this).children('td').eq(1).text( formatCurrency(discountedPrice * currencyRate, currencyFormat, currencySign, currencyBlank) );

to:

			$(this).children('td').eq(1).html( formatCurrency(discountedPrice * currencyRate, currencyFormat, currencySign, currencyBlank) );

and line 946 from:

		$(this).children('td').eq(2).text(upToTxt + ' ' + formatCurrency(discountUpTo * currencyRate, currencyFormat,

to:

		$(this).children('td').eq(2).html(upToTxt + ' ' + formatCurrency(discountUpTo * currencyRate, currencyFormat,

Then all the JavaScript prices should also have superscript numbers after the decimal character. I hope this helps.

[[email protected]]

On 25-9-2016 at 8:27 AM, rocky said:

I've tried to come up with the simplest solution I can so it will be easier to implement. Create override/classes/Tools.php with the following:

<?php

class Tools extends ToolsCore
{
    public static function displayPrice($price, $currency = null, $no_utf8 = false, Context $context = null)
    {
        if (!is_numeric($price)) {
            return $price;
        }

        $price = parent::displayPrice($price, $currency, $no_utf8, $context);

        if (!$context) {
            $context = Context::getContext();
        }
        if ($currency === null) {
            $currency = $context->currency;
        } elseif (is_int($currency)) {
            $currency = Currency::getCurrencyInstance((int)$currency);
        }

        if (is_array($currency)) {
            $c_format = $currency['format'];
        } elseif (is_object($currency)) {
            $c_format = $currency->format;
        } else {
            return false;
        }

        $decimal_char = '';

        switch ($c_format) {
            case 2:
            case 3:
                $decimal_char = ',';
                break;
            default:
                $decimal_char = '.';
        }

        $price = str_replace($decimal_char, '<sup>', $price);
        
        if (strpos($price, '<sup>') !== FALSE)
            $price .= '</sup>';
        
        return $price;        
    }
}

Remember to go to Advanced Parameters > Performance and click the "Clear cache" button (or manually delete cache/class_index.php) so PrestaShop can find the override. This will remove the decimal character from all prices and make the numbers after the decimal character superscript.

 

Unfortunately, it won't affect prices that are formatted using JavaScript. That will require more work. You'll need to change line 56 of js/tools.js from:

	return abs_val_string + virgule + (deci_string > 0 ? deci_string : '00');

to:

	return abs_val_string + '<sup>' + (deci_string > 0 ? deci_string : '00') + '</sup>';

This will add the superscript tag, but it will converted to text in product.js, so you'll need to change all the text() function calls to html() function calls. There's a lot to change, but they are easy to change since you're making the same change to each line.

 

For example, change line 297 of themes/default-bootstrap/js/product.js from:

			$('#our_price_display').text(formatCurrency(parseFloat($('#our_price_display').attr('content')), currencyFormat, currencySign, currencyBlank));

to:

			$('#our_price_display').html(formatCurrency(parseFloat($('#our_price_display').attr('content')), currencyFormat, currencySign, currencyBlank));

and line 805 from:

      $('#our_price_display').text(findSpecificPrice()).trigger('change');

to:

      $('#our_price_display').html(findSpecificPrice()).trigger('change');

and line 808 from:

      $('#our_price_display').text(formatCurrency(priceWithDiscountsDisplay, currencyFormat, currencySign, currencyBlank)).trigger('change');

to:

      $('#our_price_display').html(formatCurrency(priceWithDiscountsDisplay, currencyFormat, currencySign, currencyBlank)).trigger('change');

and line 813 from:

		$('#our_price_display').text(formatCurrency(0, currencyFormat, currencySign, currencyBlank)).trigger('change');

to:

		$('#our_price_display').html(formatCurrency(0, currencyFormat, currencySign, currencyBlank)).trigger('change');

and line 821 from:

		$('#old_price_display span.price').text(formatCurrency(basePriceDisplay, currencyFormat, currencySign, currencyBlank));

to:

		$('#old_price_display span.price').html(formatCurrency(basePriceDisplay, currencyFormat, currencySign, currencyBlank));

and line 856 from:

		$('#ecotax_price_display').text(formatCurrency(ecotax * currencyRate, currencyFormat, currencySign, currencyBlank));

to:

		$('#ecotax_price_display').html(formatCurrency(ecotax * currencyRate, currencyFormat, currencySign, currencyBlank));

and line 804 from:

		$('#unit_price_display').text(formatCurrency(unit_price * currencyRate, currencyFormat, currencySign, currencyBlank));

to:

		$('#unit_price_display').html(formatCurrency(unit_price * currencyRate, currencyFormat, currencySign, currencyBlank));

and line 945 from:

			$(this).children('td').eq(1).text( formatCurrency(discountedPrice * currencyRate, currencyFormat, currencySign, currencyBlank) );

to:

			$(this).children('td').eq(1).html( formatCurrency(discountedPrice * currencyRate, currencyFormat, currencySign, currencyBlank) );

and line 946 from:

		$(this).children('td').eq(2).text(upToTxt + ' ' + formatCurrency(discountUpTo * currencyRate, currencyFormat,

to:

		$(this).children('td').eq(2).html(upToTxt + ' ' + formatCurrency(discountUpTo * currencyRate, currencyFormat,

Then all the JavaScript prices should also have superscript numbers after the decimal character. I hope this helps.

After the above

I have added changes to: themes/mytheme/js/modules/blockcart/ajax_cart.js

as the prices in the "add to cart" pop-up  still looked like:    15, ⁷⁵

Doing the same thing as in the product.js: with prices (NOT quantities) change .text to .html

it works for me, i don't know if it was wrong to do it like this.

[cristidam]

Hello,

The override works fine in Prestashop 1.7 but 100⁷⁰ is displayed. Where should I make the javascript changes (text->html) because product.js is no longer in PS 1.7?

Thank you!