⚠️ 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.
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
Go to Upcart > Cart Editor > Settings > Custom HTML
From the Select HTML Location dropdown, choose Scripts (Before load)
Paste the script below into the input field
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: |
|
useCurrencyCode | Show or hide the currency code (example: |
|
currencySymbolPlacement | Where the symbol appears |
|
currencyCodePlacement | Where the code appears |
|
currencySymbolSpacing | Adds a space between symbol and amount (example: |
|
currencyCodeSpacing | Adds a space between code and amount (example: |
|
currencyFormat | Controls number formatting |
|
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.