Magneto 2: Need to remove decimal from price on product detail page

Question

I want to remove the decimal in price on product details page. Although it removes in listing page, but still showing decimal in discount and final price on product details page.

Answer 1

Create file and use this code :

=> From :

vendor/magento/module-catalog/view/base/templates/product/price/amount/default.phtml

=> To :

app/design/frontend/VendorName/ModuleName/Magento_Catalog/templates/product/price/amount/default.phtml

this file is defined from \Magento\Framework\Pricing\Render\Amount

The price itself is coming from this call:

<?php /* @escapeNotVerified */ echo $block->formatCurrency($block->getDisplayValue(), (bool)$block->getIncludeContainer()) ?>

If we take a look at the file that this method is created based on the class it's inheriting (/vendor/magento/framework/Pricing/Render/Amount.php)

Update line no 24

<?php /* @escapeNotVerified */ echo $block->formatCurrency($block->getDisplayValue(), (bool)$block->getIncludeContainer()) ?>

To

<?php /* @escapeNotVerified */ echo $block->formatCurrency($block->getDisplayValue(), (bool)$block->getIncludeContainer() , 0) ?>

You need to override

vendor/magento/module-catalog/view/base/web/js/price-utils.js

To

app/design/frontend/VendorName/ModuelName/Magento_Catalog/web/js/price-utils.js

and change the value of precision on line 38:

var precision = isNaN(format.requiredPrecision = Math.abs(format.requiredPrecision)) ? 2 : format.requiredPrecision,

To

var precision = 0,

Answer 2

The best way I could find is to change the priceFormat function from Magento_Catolag/js/price-utils.js inside my priceBox.js, so in your requirejs-config.js

var config = {

"map": {

"*": {

"priceBox" : "Vendor_ModuleName/js/price-box"

}
}
};

Copy the whole Magento_Catalog/js/price-box.js to your Vendor/ModuleName/view/frontend/web/js/price-box.js and after the use strict add:

var globalPriceFormat = {

        requiredPrecision: 2,

        integerRequired: 1,

        decimalSymbol: ',',

        groupSymbol: ',',

        groupLength: ','

    };

Under this copy the formatPrice function from price-utils.js

Change:

function formatPrice(amount, format, isShowSign) {

var s = '',

            precision, integerRequired, decimalSymbol, groupSymbol, groupLength, pattern, i, pad, j, re, r, am;

To

function formatPriceHack(amount, format, isShowSign) {
var s = '',

            precision = 0, integerRequired, decimalSymbol, groupSymbol, groupLength, pattern, i, pad, j, re, r, am;

Also comment:

        

//precision = isNaN(format.requiredPrecision = Math.abs(format.requiredPrecision)) ? 2 : format.requiredPrecision;

And change:

i = stringPad('0', pad) + i;

To inside formatPriceHack:

i = utils.strPad('0', pad) + i;

And last, change inside the reloadPrice function from priceBox:

price.formatted = utils.formatPrice(price.final, priceFormat);

To:

price.formatted = formatPriceHack(price.final, priceFormat);

That's it.