Setting up the Currency Converter app

Here comes a universal truth: no one likes surprise fees or hidden costs. If your visitors don’t know how much they’re spending, they’re unlikely to make it to the end of the checkout process. Yes, forcing customers to calculate exchange rates is a quick way to lose sales 💔.

The Currency Converter in Vitals provides real-time, automatic currency conversion based on the location of your visitors.

The Currency Converter app in Vitals is one of our flagship apps, and setting it up correctly it's vital for every merchant.

We follow Shopify's recommended best practice not to modify your theme files - so install with total confidence.

To configure the currency converter, you'll first need to prepare your store for currency conversion.

How to prepare your store for currency conversion?

Before using the Currency Converter app, you should edit your store's currency format for the app to function correctly.

You'll first need to access the Settings General section in your Shopify admin - then scroll to the Store Currency section of the page and click on Change formatting.

If your store's default currency is USD, replace the  HTML with currency field with this snippet:

<span class=money>${{amount}} USD</span>

Next, replace the  HTML without currency field with this snippet:

<span class=money>${{amount}}</span>

This would result like the following:

Needless to say, you should adjust the currency symbol and abbreviation to match your store's default currency. If it's EUR, for example, the two snippets should look like this:

<span class=money>€ {{amount}} EUR</span>

<span class=money>€ {{amount}}</span>

How to adjust the currency format to properly distinguish Dollar-based markets

Shopify's best practice when you're selling to various Dollar-based markets (like US ⇒ USD, Canada ⇒ CAD, Australia ⇒ AUD, Hong Kong ⇒ HKD) is to adjust your currency format like below: 

<span class=money>$ {{amount}} USD</span>  

This is for both HTML with currency as well as HTML without currency. Basically, use the currency 3-letter name to make it crystal-clear for your customers in what currency the costs are displayed.

The final result should look like this:

That's it. You've now prepared your store for currency conversion.

You can now add the currencies you want to display in your currency switcher, modify the app's settings as you need them, and you're good to go.

Don't forget to force-refresh your browser to see the changes reflected on your store instantly.