How to Add a Country Code Dropdown to a Phone Number Field

Follow

This script adds a country selector with flags and dialing codes to the phone number field on a Classic Builder form, using the intl-tel-input library.

This is community code, not an official Unbounce feature. Unbounce Support can't troubleshoot custom code. Test it on a published page before relying on it, and work with a developer if you aren't comfortable editing HTML, JavaScript, and CSS.

See the demo page built in Unbounce.

Screenshot 2022-03-15 at 8.23.34 PM

Add the dropdown to your form

  1. Copy the first script and add it to the JavaScripts section with placement set to Head.
  2. Copy the second script and add it to the JavaScripts section with placement set to Before Body End Tag.
  3. Copy the CSS and add it to the Stylesheets section.
  4. Set the ID of your phone number field to phone.

    Screenshot 2022-03-15 at 8.46.23 PM
  5. Save and republish the page.