Magento 2 Customization: Change Currency Symbol Position with Code

How to Change Currency Symbol Position in Magento 2

In Magento 2, the default behavior places the currency symbol on the left side of the price. However, many store owners may wish to move the currency symbol to the right for better localization or customer experience. Since Magento 2 does not provide a built-in feature for this, we’ll demonstrate a simple programmatic solution to change the currency symbol position.

Why Change Currency Symbol Position?

Positioning the currency symbol correctly enhances user experience and aligns with regional conventions. For example:

• Left Position: Common in USD ($100).

• Right Position: Common in countries like France (100€).

To meet these requirements, we will use an Observer and events.xml configuration file.

Step-by-Step Solution to Change Currency Symbol Position
1. Create events.xml

Location: app/code/vendor/Exenstion/etc/frontend/events.xml

XML:

<?xml version="1.0"?>

<config xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"

        xsi:noNamespaceSchemaLocation="urn:magento:framework:Event/etc/events.xsd">

    <event name="currency_display_options_forming">

        <observer name="change_currency_position" instance="vendor\Exenstion\Observer\ChangeCurrencyPosition"/>

    </event>

</config>

Explanation:

• The currency_display_options_forming event is triggered during the display of currency options.

• This event allows modification of the currency symbol position via an observer.

2. Create Observer File

Location: app/code/vendor/Exenstion/Observer/ChangeCurrencyPosition.php

<? php

namespace vendor\Exenstion\Observer;

use Magento\Framework\Event\ObserverInterface;

class ChangeCurrencyPosition implements ObserverInterface {

  public function execute(\Magento\Framework\Event\Observer $observer) {

    $currencyOptions = $observer -> getEvent() -> getCurrencyOptions();

    $currencyOptions -> setData('position', \Magento\Framework\Currency:: RIGHT); // Set currency to right

    return $this;

  }

}

?>

Explanation:

• The observer listens to the currency_display_options_forming event.

• It modifies the position attribute of the currency options to \Magento\Framework\Currency::RIGHT.

Folder Structure
Ensure your folder structure looks like this:

app
└── code
    └── vendor
        └── Exenstion
            ├── etc
            │   └── frontend
            │       └── events.xml
            └── Observer
                └── ChangeCurrencyPosition.php

Testing the Implementation
1. Clear Cache: Run the following commands to ensure your changes take effect:

bash:

php bin/magento cache:clean
php bin/magento cache:flush

2. Test the Storefront: Navigate to your storefront and check the product prices. The currency symbol should now appear on the right side of the price.

Conclusion
Changing the position of the currency symbol in Magento 2 requires a bit of custom development, as there’s no built-in configuration for this. By following the steps above, you can easily customize your Magento store to match the currency formatting standards of your target audience.