Localise country names

International Telephone Input supports some measure of internationalisation, allowing you to localise the country names in the dropdown. Using the localisedCountries option, you can pass an object with one entry for each country, where the key is the country code, and the value is the localised country name. This means that you're able to display the country names in your user's language, which provides a much better user experience.

In the example below, we localise the country names to German, as a demonstration. We also use the onlyCountries option to limit the countries to just the few that we have chosen to localise, whereas by default they would all be shown, localised or not.

Demo

Markup

<input id="phone" type="tel">

Code

const input = document.querySelector("#phone");

window.intlTelInput(input, {
  localizedCountries: {
    fr: "Frankreich",
    de: "Deutschland",
    es: "Spanien",
    it: "Italien",
    ch: "Schweiz",
    nl: "Niederlande",
    at: "Österreich",
    dk: "Dänemark",
  },
  onlyCountries: ["fr", "de", "es", "it", "ch", "nl", "at", "dk"],
  utilsScript: "/intl-tel-input/js/utils.js?1690975972744" // just for formatting/placeholders etc
});