Вставить в head
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/intl-tel-input@24.3.2/build/css/intlTelInput.css">
<style>
.iti--allow-dropdown {
width: 100%;
}
.iti .iti__selected-dial-code{
font-size: var( --e-global-typography-text-font-size );
line-height: var( --e-global-typography-text-line-height );
font-family: var( --e-global-typography-text-font-family ), Sans-serif;
}
button.iti__selected-country{
color: unset !important;
background-color: unset !important;
text-decoration: none;
}
</style>
вставить в конец body
<script src="https://cdn.jsdelivr.net/npm/intl-tel-input@24.3.2/build/js/intlTelInput.min.js"></script>
<script>
// const input = document.querySelector("#form-field-phone");
const input = document.querySelector("input[type='tel']");
window.intlTelInput(input, {
initialCountry: "auto",
geoIpLookup: callback => {
fetch("https://ipapi.co/json")
.then(res => res.json())
.then(data => callback(data.country_code))
.catch(() => callback("pl"));
},
// onlyCountries: ['ru','by','pl'],
separateDialCode: true,
strictMode: true,
utilsScript: "https://cdn.jsdelivr.net/npm/intl-tel-input@24.3.2/build/js/utils.js",
});
</script>
текст