Customize Multi-Currency

Harshdeep Gujjar

Modified on: Mon, 16 Aug, 2021 at 12:20 PM

Follow the steps below to enable currency switching in Klevu search results.

Login into Shopify Admin
Go to Online Store → Custom theme → Edit HTML/CSS
Go to Edit layout
Open theme.liquid file

Add below code before </body> tag

<script>
 function getCurrencyRatesObject() {
   var currencySymbol,
    rates = Currency.rates,
    klevu_rates = [],
    appendCurrencyAtEnd = [];
    
  for (var prop in rates) {
    currencySymbol = prop === "USD" ? "$" : prop;
    klevu_rates[prop] = (1 / rates[prop]) + ":" + currencySymbol + ":" +
                        (appendCurrencyAtEnd.indexOf(prop) > -1);
    }
    return klevu_rates;
 }
 var klevu_currentCurrencyRates = getCurrencyRatesObject();
 var klevu_currentCurrencyCode = "CAD";
 </script>

Refresh your browser cache.

In appendCurrencyAtEnd array, add currency codes for the currencies which you want to show after amount, e.g. {amount} EUR, as follows:

appendCurrencyAtEnd = ["EUR","SEK"];

Please note, the value of the variable klevu_currentCurrencyCode should be set and updated as per the currently selected currency on the store.

The format of klevu_currentCurrencyRates Object is as follows.

{ currencyCode : "currencyRate:currencySymbol", .... }

If you need to update the currencySymbols, you could do so by updating the following code in the getCurrencyRatesObject function.

currencySymbol = prop === "USD" ? "$" : prop;

On search landing page, if the user selects another currency, please update the value of klevu_currentCurrencyCode and call the following function to reload the results with new currency.

klevu_getSearchResults();