How to Display Percentage of Discount on Product List and View Page in Magento 2
Discounts have been the most effective tool to beat the competition, attract potential customers, and generate sales for ages!
Offering attractive deals to the customers is surely going to increase the conversion rate.
However, it is equally important to tactfully present your offers to the customers in a way that will lure them to make a purchase.
For Magento 2 store owners, it is going to be easy with the solution given below to display percentage discount on the product page and category page.
Showing the percentage value of discount along with the original price and special price that the default Magento 2 displays will push the potential customer to avail the deal.
Check the programmatic solution to display percentage of discount on product list and view page in Magento 2 below:
Steps to Display Percentage of Discount on Product List and View Page in Magento 2:
Override the below file in your theme
|
1 |
Magento_Catalog::product/price/final_price.phtml |
and put the below code in the file.
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 |
<!--?php /** @var \Magento\Catalog\Pricing\Render\FinalPriceBox $block */ /** ex: \Magento\Catalog\Pricing\Price\RegularPrice */ /** @var \Magento\Framework\Pricing\Price\PriceInterface $priceModel */ $priceModel = $block->getPriceType('regular_price'); /** ex: \Magento\Catalog\Pricing\Price\FinalPrice */ /** @var \Magento\Framework\Pricing\Price\PriceInterface $finalPriceModel */ $finalPriceModel = $block->getPriceType('final_price'); $idSuffix = $block->getIdSuffix() ? $block->getIdSuffix() : ''; $schema = ($block->getZone() == 'item_view') ? true : false; $fprice=($finalPriceModel->getAmount()->getValue()); $rprice=$priceModel->getAmount()->getValue(); $discount = 100 - round(($fprice / $rprice) * 100); ?--> <!--?php if ($block->hasSpecialPrice()) :?--> <!--?= /* @noEscape */ $block->renderAmount($finalPriceModel->getAmount(), [ 'display_label' => __('Special Price'), 'price_id' => $block->getPriceId('product-price-' . $idSuffix), 'price_type' => 'finalPrice', 'include_container' => true, 'schema' => $schema ]); ?--> <!--?= $discount."% Discount";?--> <!--?= /* @noEscape */ $block->renderAmount($priceModel->getAmount(), [ 'display_label' => __(' '), 'price_id' => $block->getPriceId('old-price-' . $idSuffix), 'price_type' => 'oldPrice', 'include_container' => true, 'skip_adjustments' => true ]); ?--> <!--?php else :?--> <!--?= /* @noEscape */ $block->renderAmount($finalPriceModel->getAmount(), [ 'price_id' => $block->getPriceId('product-price-' . $idSuffix), 'price_type' => 'finalPrice', 'include_container' => true, 'schema' => $schema ]); ?--> <!--?php endif; ?--> <!--?php if ($block->showMinimalPrice()) :?--> <!--?php if ($block->getUseLinkForAsLowAs()) :?--> <!--?= /* @noEscape */ $block->renderAmountMinimal() ?--> <!--?php else :?--> <!--?= /* @noEscape */ $block->renderAmountMinimal() ?--> <!--?php endif?--> <!--?php endif; ?--> |
That’s it.
Any doubts in the above solution? Please feel free to mention them in the Comments section below.
Also read: How to Setup Discount with Minimum Purchase in Magento 2
I’d be glad to help you out.
Also, do share the post with Magento Community via social media.
Thank you.
Prev
How to Create Root Script in Magento 2
How to Create Barcode and Add it in Magento 2 Invoice PDF
Next