> ## Documentation Index
> Fetch the complete documentation index at: https://docs.aftersell.com/llms.txt
> Use this file to discover all available pages before exploring further.

# Customize Currency Formatting in Upcart

> Control how currency is displayed in your cart using Shopify Markets and custom script settings.

⚠️ **Important notice**

This customization only works with Version 1 of the Upcart cart modules. If you recently upgraded your cart to Version 2, these customizations may not work. You will need to use the new selectors provided for Version 2 in the [migration guide.](/upcart/upcart_v20_migration_guide)

If your customizations are not working as expected, you can also revert your cart back to Version 1 instead of using Version 2.

We are currently working on new customization templates for Version 2 of the modules, and they will be available soon.

# Overview

This customization lets you change how currency symbols and codes appear in your Upcart cart drawer. You can control whether to show the currency symbol (for example `$`), the currency code (for example `USD`), where they appear, and how they are spaced.

This setup requires that:

* Your store is using **Shopify Markets**, or
* You are working with a **single market**

***

## Where to add the script

1. Go to **Upcart > Cart Editor > Settings > Custom HTML**
2. From the **Select HTML Location** dropdown, choose **Scripts (Before load)**
3. Paste the script below into the input field
4. Save your changes

***

## Currency formatting script

```html theme={"theme":{"light":"snazzy-light","dark":"github-dark"}}
<!-- Upcart Currency Formatting Script -->
<script>
// ~~~~~~START OF MERCHANT SETTINGS~~~~~~
let useCurrencySymbol = true;
let useCurrencyCode = true;
let currencySymbolPlacement = 'left';     // 'left' or 'right'
let currencyCodePlacement = 'right';      // 'left' or 'right'
let currencySymbolSpacing = false;
let currencyCodeSpacing = true;
let currencyFormat = "{{amount}}";        // Use Shopify's currency format
// ~~~~~~END OF MERCHANT SETTINGS~~~~~~

formatCurrency();

function formatCurrency() {
  let currencyMap = fillCurrencyMap(new Map());
  let currencyCode = Shopify.currency.active;
  let currencySymbol = currencyMap.get(currencyCode);

  if (currencySymbolPlacement == 'left' && currencyCodePlacement == 'left') {
    window.upcartMoneyFormat =
      (useCurrencyCode ? currencyCode : "") +
      (currencyCodeSpacing && useCurrencyCode ? " " : "") +
      (useCurrencySymbol ? currencySymbol : "") +
      (currencySymbolSpacing && useCurrencySymbol ? " " : "") +
      currencyFormat;

  } else if (currencySymbolPlacement == 'left' && currencyCodePlacement == 'right') {
    window.upcartMoneyFormat =
      (useCurrencySymbol ? currencySymbol : "") +
      (currencySymbolSpacing && useCurrencySymbol ? " " : "") +
      currencyFormat +
      (currencyCodeSpacing && useCurrencyCode ? " " : "") +
      (useCurrencyCode ? currencyCode : "");

  } else if (currencySymbolPlacement == 'right' && currencyCodePlacement == 'right') {
    window.upcartMoneyFormat =
      currencyFormat +
      (currencyCodeSpacing && useCurrencyCode ? " " : "") +
      (useCurrencyCode ? currencyCode : "") +
      (currencySymbolSpacing && useCurrencySymbol ? " " : "") +
      (useCurrencySymbol ? currencySymbol : "");

  } else if (currencySymbolPlacement == 'right' && currencyCodePlacement == 'left') {
    window.upcartMoneyFormat =
      (useCurrencyCode ? currencyCode : "") +
      (currencyCodeSpacing && useCurrencyCode ? " " : "") +
      currencyFormat +
      (currencySymbolSpacing && useCurrencySymbol ? " " : "") +
      (useCurrencySymbol ? currencySymbol : "");

  } else {
    console.warn("Unexpected placement configuration. Falling back to default.");
    window.upcartMoneyFormat =
      (useCurrencySymbol ? currencySymbol : "") +
      (currencySymbolSpacing && useCurrencySymbol ? " " : "") +
      currencyFormat +
      (currencyCodeSpacing && useCurrencyCode ? " " : "") +
      (useCurrencyCode ? currencyCode : "");
  }
}

function fillCurrencyMap(map) {
  map.set('EUR', '€');
  map.set('GBP', '£');
  map.set('JPY', '¥');
  map.set('AUD', '$');
  map.set('CAD', '$');
  map.set('CHF', 'CHF');
  map.set('CNY', '¥');
  map.set('INR', '₹');
  map.set('RUB', '₽');
  map.set('BRL', 'R$');
  map.set('ZAR', 'R');
  map.set('MXN', '$');
  map.set('SGD', '$');
  map.set('NZD', '$');
  map.set('HKD', 'HK$');
  return map;
}
</script>
```

***

## Settings explained

Inside the script, look for this section:

```
// ~~~~~~START OF MERCHANT SETTINGS~~~~~~
```

You can adjust these values to control how currency appears in the cart:

|                             |                                                             |                                                                                    |
| --------------------------- | ----------------------------------------------------------- | ---------------------------------------------------------------------------------- |
| Setting                     | Description                                                 | Options                                                                            |
| **useCurrencySymbol**       | Show or hide the currency symbol (example: `$`)             | `true` / `false`                                                                   |
| **useCurrencyCode**         | Show or hide the currency code (example: `USD`)             | `true` / `false`                                                                   |
| **currencySymbolPlacement** | Where the symbol appears                                    | `'left'` / `'right'`                                                               |
| **currencyCodePlacement**   | Where the code appears                                      | `'left'` / `'right'`                                                               |
| **currencySymbolSpacing**   | Adds a space between symbol and amount (example: `$ 10.00`) | `true` / `false`                                                                   |
| **currencyCodeSpacing**     | Adds a space between code and amount (example: `10 USD`)    | `true` / `false`                                                                   |
| **currencyFormat**          | Controls number formatting                                  | `{{amount}}`, `{{amount_no_decimals}}`, etc. (refer to Shopify's currency options) |

***

## Final result

Once the script is added and saved:

* Currency symbols and codes display exactly as configured
* Works across all parts of the Upcart drawer, including rewards and upsells
* Adapts to **Shopify Markets** automatically if they are enabled

***

## Need help?

For advanced customization, we recommend working with a **Shopify Expert**. Upcart's support team does not assist with writing or troubleshooting custom code.

[See Shopify Experts](https://www.shopify.com/partners/directory)
