DOCS

Customize display countries

Customize display countries

Override how Hello displays for certain countries.

By default, Hello will only display for countries that are in a shipping zone in your Zonos settings. If you wish to display Hello for all countries or only for specific countries, you can customize the country display behavior in your JavaScript integration.

Country display behaviors 

Hello supports the following currency display formats:

  • ONLY_SHIPPABLE (default) - Only display Hello for countries which are in a shipping zone in your Zonos settings.
  • ALL - Display Hello for all countries.
  • A list of ISO country codes - Only display Hello for the countries listed.

You can override the Hello country display behavior by passing the showForCountries property into the helloSettings object in Zonos.init.

JavaScript

1
2
3
4
5
Zonos.init({
  helloSettings: {
    showForCountries: "ALL",
  },
});

Listen for country changes 

You can listen for changes to the selected country in Hello by passing a callback function to the onCountryChange property in the helloSettings object in Zonos.init. This will trigger whenever the user selects a new country from the Hello country selector.

JavaScript

1
2
3
4
5
6
7
8
window.Zonos.init({
  helloSettings: {
    onCountryChange: function (countryCode, currencyCode) {
      console.log("Selected country and currency:", countryCode, currencyCode);
    },
  },
  }
});

Was this page helpful?