Removing Comma Separator from Product List

Oct 13, 2025 by wbrum.org 116 views

Introduction

Magento 2.1 is a powerful e-commerce platform that provides a wide range of features and functionalities to its users. However, one of the common issues that users face is the display of prices with comma separators. In this article, we will discuss how to remove the comma separator from prices in Magento 2.1, both in the product list and product page.

Understanding the Issue

In Magento 2.1, prices are displayed with comma separators by default. This is because the platform uses the number_format function to format the prices. The number_format function is responsible for adding commas to the numbers to make them more readable. However, in some cases, users may want to remove the comma separator from the prices.

Why Remove Comma Separator?

There are several reasons why users may want to remove the comma separator from prices in Magento 2.1. Some of the reasons include:

Internationalization: In some countries, prices are displayed without commas. For example, in the United States, prices are displayed with a decimal point, while in the United Kingdom, prices are displayed with a decimal point and a pound sign.
Customization: Users may want to customize the display of prices on their website to match their brand's style and design.
Accessibility: Removing the comma separator can make the prices more accessible to users who have visual impairments or use screen readers.

Removing Comma Separator from Product List

To remove the comma separator from prices in the product list, you can follow these steps:

Step 1: Create a Custom Module

First, you need to create a custom module in Magento 2.1. You can do this by creating a new directory in the app/code directory of your Magento installation. For example, you can create a directory called Vendor_Module.

Step 2: Create a Custom Block

Next, you need to create a custom block in your module. You can do this by creating a new file called Block.php in the Block directory of your module. For example, you can create a file called Block.php in the app/code/Vendor/Module/Block directory.

// app/code/Vendor/Module/Block/Block.php
namespace Vendor\Module\Block;
use Magento\Framework\View\Element\Template;
class Block extends Template
{
public function getFormattedPrice( $price) { return number_format($ price, 2, '.', '');
}
}

Step 3: Create a Custom Template

Next, you need to create a custom template for your block. You can do this by creating a new file called product_list.phtml in the templates directory of your module. For example, you can create a file called product_list.phtml in the app/code/Vendor/Module/templates directory.

<!-- app/code/Vendor/Module/templates/product_list.phtml -->
<?php
/** @var \Magento\Catalog\Block\Product\ProductList $block */
?>
<div class="product-list">
<?php foreach ($block->getItems() as $item): ?>
<div class="product-item">
<h2><?php echo $item->getName(); ?></h2>
<p>Price: <?php echo  $block-&gt;getFormattedPrice($ item->getPrice()); ?></p>
</div>
<?php endforeach; ?>
</div>

Step 4: Register the Custom Block

Finally, you need to register the custom block in your module. You can do this by creating a new file called etc/di.xml in the etc directory of your module. For example, you can create a file called di.xml in the app/code/Vendor/Module/etc directory.

<!-- app/code/Vendor/Module/etc/di.xml -->
<?xml version="1.0"?>
<config xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance&quot;
xsi:noNamespaceSchemaLocation="urn:magento:framework:ObjectManager/etc/config.xsd">
<preference for="Magento\Catalog\Block\Product\ProductList" type="Vendor\Module\Block\Block"/>
</config>

Removing Comma Separator from Product Page

To remove the comma separator from prices on the product page, you can follow these steps:

Step 1: Create a Custom Module

Step 2: Create a Custom Block

// app/code/Vendor/Module/Block/Block.php
namespace Vendor\Module\Block;
use Magento\Framework\View\Element\Template;
class Block extends Template
{
public function getFormattedPrice( $price) { return number_format($ price, 2, '.', '');
}
}

Step 3: Create a Custom Template

Next, you need to create a custom template for your block. You can do this by creating a new file called product.phtml in the templates directory of your module. For example, you can create a file called product.phtml in the app/code/Vendor/Module/templates directory.

<!-- app/code/Vendor/Module/templates/product.phtml -->
<?php
/** @var \Magento\Catalog\Block\Product\View $block */
?>
<div class="product">
<h1><?php echo $block->getName(); ?></h1>
<p>Price: <?php echo  $block-&gt;getFormattedPrice($ block->getPrice()); ?></p>
</div>

Step 4: Register the Custom Block

<!-- app/code/Vendor/Module/etc/di.xml -->
<?xml version="1.0"?>
<config xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance&quot;
xsi:noNamespaceSchemaLocation="urn:magento:framework:ObjectManager/etc/config.xsd">
<preference for="Magento\Catalog\Block\Product\View" type="Vendor\Module\Block\Block"/>
</config>

Conclusion

Q: What is the purpose of removing the comma separator from prices in Magento 2.1?

A: The purpose of removing the comma separator from prices in Magento 2.1 is to customize the display of prices on your website. This can be useful for internationalization, customization, and accessibility purposes.

Q: How do I remove the comma separator from prices in the product list?

A: To remove the comma separator from prices in the product list, you need to create a custom module, block, and template. You can follow the steps outlined in the previous article to achieve this.

Q: How do I remove the comma separator from prices on the product page?

A: To remove the comma separator from prices on the product page, you need to create a custom module, block, and template. You can follow the steps outlined in the previous article to achieve this.

Q: What is the difference between the product list and product page?

A: The product list and product page are two different pages in Magento 2.1. The product list is a page that displays a list of products, while the product page is a page that displays the details of a single product.

Q: Can I remove the comma separator from prices in other areas of my website?

A: Yes, you can remove the comma separator from prices in other areas of your website, such as the cart and checkout pages. However, this may require additional customizations and modifications to your website.

Q: How do I test the removal of the comma separator from prices?

A: To test the removal of the comma separator from prices, you can use the Magento 2.1 built-in debugging tools or add custom logging statements to your code. You can also use a web browser's developer tools to inspect the HTML and CSS of your website.

Q: Can I use a third-party extension to remove the comma separator from prices?

A: Yes, you can use a third-party extension to remove the comma separator from prices. However, this may require additional customizations and modifications to your website, and may also introduce security risks if not properly configured.

Q: How do I update my website to use the new price formatting?

A: To update your website to use the new price formatting, you need to clear the Magento 2.1 cache and re-index the data. You can also use a web browser's developer tools to inspect the HTML and CSS of your website and verify that the new price formatting is being applied correctly.

Q: Can I use a custom template to remove the comma separator from prices?

A: Yes, you can use a custom template to remove the comma separator from prices. You can create a custom template file and override the default template file to apply the new price formatting.

Q: How do I troubleshoot issues with the removal of the comma separator from prices?

A: To troubleshoot issues with the removal of the comma separator from prices, you can use the Magento 2.1 built-in debugging tools or add custom logging statements to your code. You can also use a web browser's developer tools to inspect the HTML and CSS of your website and identify any issues with the price formatting.