IMPORTANT

This script will only work if either of these conditions are met:

If only one market is in use
or
If using multiple markets, Shopify Markets MUST be in use.

Accessing Custom HTML Field
To begin customizing the HTML for your UpCart, follow these steps:
1. Open the UpCart App.
2. Click on Cart Editor.
3. Click on Settings and scroll down the page until you find the section labeled "Custom HTML"
4. Select "Scripts (Before Load)" from the "Select HTML Location" dropdown

Insert Code

Copy and paste the code below into the Custom HTML dropdown for Scripts (Before load) then Save.

<!-- UpCart Currency Formatting Script -->
<script>
// ~~~~~~START OF MERCHANT SETTINGS~~~~~~
    
        // true = "$___", false = "___"
        let useCurrencySymbol = true; 

        // true = "___ CAD", false = "___"
        let useCurrencyCode = true; 

        // 'left' = "$___", 'right' = "___$"
        let currencySymbolPlacement = 'left';

        // 'left' = "CAD ___", 'right' = "___ CAD"
        let currencyCodePlacement = 'right';

        // true = "$ 10.00", false = "$10.00"
        let currencySymbolSpacing = false; 

        // true = "___ CAD", false = "___CAD"
        let currencyCodeSpacing = true; 
        
        // How the actual number displays, see full list of options at 
        // https://help.shopify.com/en/manual/international/pricing/currency-formatting#currency-formatting-options
        let currencyFormat = "{{amount}}"; 

    // ~~~~~~END OF MERCHANT SETTINGS~~~~~~

    formatCurrency();

    function formatCurrency(){
        let currencyMap = fillCurrencyMap(new Map());

        let currencyCode = Shopify.currency.active; // CAD, JPY, EUR, etc...
        let currencySymbol = currencyMap.get(currencyCode); // $, ¥, €, etc...

        // CAD $10.00
        if(currencySymbolPlacement == 'left' && currencyCodePlacement == 'left')
        {
            window.upcartMoneyFormat = (useCurrencyCode?currencyCode:"") + ((currencyCodeSpacing && useCurrencyCode)? " ": "") + (useCurrencySymbol?currencySymbol:"") + ((currencySymbolSpacing && useCurrencySymbol)? " ": "") + currencyFormat;
        }
        // $10.00 CAD
        else if(currencySymbolPlacement == 'left' && currencyCodePlacement == 'right')
        {
            window.upcartMoneyFormat = (useCurrencySymbol?currencySymbol:"") + ((currencySymbolSpacing && useCurrencySymbol)? " ": "") + currencyFormat + ((currencyCodeSpacing && useCurrencyCode)? " ": "") + (useCurrencyCode?currencyCode:"");
        }
        // 10.00$ CAD
        else if(currencySymbolPlacement == 'right' && currencyCodePlacement == 'right')
        {
            window.upcartMoneyFormat = currencyFormat + ((currencyCodeSpacing && useCurrencyCode)? " ": "") + (useCurrencyCode?currencyCode:"") + ((currencySymbolSpacing && useCurrencySymbol)? " ": "") + (useCurrencySymbol?currencySymbol:"");
        }
        // CAD 10.00$
        else if(currencySymbolPlacement == 'right' && currencyCodePlacement == 'left')
        {
            window.upcartMoneyFormat = (useCurrencyCode?currencyCode:"") + ((currencyCodeSpacing && useCurrencyCode)? " ": "") + currencyFormat + ((currencySymbolSpacing && useCurrencySymbol)? " ": "") + (useCurrencySymbol?currencySymbol:"");
        }
        // Unknown placement
        else
        {
            console.warn("UpCart Currency Formatter Script (In the 'Scripts (Before Load) Custom HTML section') had an unexpected placement value. Defaulting to $10.00 CAD/EUR/JPY/etc.");
            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>

Modify Script Settings

Near the top of the script you'll see a

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

and a

    // ~~~~~~END OF MERCHANT SETTINGS~~~~~~

comment. In between these two comments you'll find settings that you can use to change how your currency displays.

Here's a breakdown of what each setting does, and what possible values it may have.

Setting	What it Does	Possible Values
`useCurrencySymbol`	Whether to include the currency symbol (like `$` or `¥`) in the price.	`true`: Show the currency symbol. or `false`: Omit the currency symbol.
`useCurrencyCode`	Whether to include the currency code (like `USD` or `JPY`) in the price.	`true`: Show the currency code. or `false`: Omit the currency code.
`currencySymbolPlacement`	Controls whether the currency symbol (like `$` or `¥`) appears to the left or right of the price.	`'left'`: Place the symbol before the number (e.g., `$10`). or `'right'`: Place the symbol after the number (e.g., `10$`).
`currencyCodePlacement`	Controls whether the currency code (like `USD` or `JPY`) appears to the left or right of the price.	`'left'`: Place the code before the number (e.g., `USD 10`). or `'right'`: Place the code after the number (e.g., `10 USD`).
`currencySymbolSpacing`	Adds a space between the currency symbol and the price if enabled.	`true`: Adds a space (e.g., `$ 10`). or `false`: No space (e.g., `$10`).
`currencyCodeSpacing`	Adds a space between the currency code and the price if enabled.	`true`: Adds a space (e.g., `10 USD`). or `false`: No space (e.g., `10USD`).
`currencyFormat`	Determines how the number in the price is displayed.	Possible values can be found in this part of Shopify's Documentation.

Add an End Total Line Above the Checkout Button with CSS

IMPORTANT

Accessing Custom HTML Field

Insert Code

Modify Script Settings