Skip to main content

Customize Currency Formatting in Upcart

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

Updated today

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

<!-- 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.

Did this answer your question?