1. Home
  2. Cool FormKit For Elementor Pro Form
  3. Add Country Code dropdown to Tel Field in Elementor Forms

Add Country Code dropdown to Tel Field in Elementor Forms

You can easily add a country code dropdown in your form inside your Elementor Pro page. Please just follow these steps:-

* Firstly, make sure you have Turned on the Country Code for Tel Field feature in the WordPress Admin Panel >> Elementor >> Cool FormKit >> Form Elements Tab.

  • Search “Form” inside the Elementor widgets section.
  • It will create a form with the three default fields.
  • Select “Tel” field type.
  • Now, turn on “Country Code” switch.
  • You will see the country code dropdown get added to the tel field.
  • After turn on “Country Code” switch, you will access the list of controls to optimize country code dropdown as per your needs.
  • Default Country:- Whenever you visit the page, the default country will be pre selected country before you select any other country. You can set the default country as per your requirement.
  • Only Countries:- You can mention the list of countries you want to include in the dropdown.
  • Exclude Countries:- Here you can mention the list of countries you want to exclude from the dropdown.
  • Preferred Countries:- You can the set the order in which the countries must appear in the dropdown. The countries mentioned here will appear at the top of the list.
  • Automatically Detect Country :- The “Automatically Detect Country” setting automatically selects the country in the dropdown menu based on the user’s IP address. In our plugin, the upto 60,000 IP Lookups / month are free. This IP lookup limit can be changed by upgrading the plan by the visiting the site link. You’ll receive an API key along with usage instructions when you sign-up for a paid plan.

How to add API key?

  1. Click on the “Add API Key” link provided under the Automatically Detect Country setting.
  2. You will get redirected to WordPress Admin panel under Elementor >> Cool FormKit >> Settings Tab.
  1. Enter the API key in the input field.
  2. Click on the “Save Changes” button.

Add Country Field for Elementor Form

You can easily add a country field in your form inside your Elementor Pro page. Please just follow these steps:-

  • Search “Form” inside the Elementor widgets section.
  • It will create a form with the default three fields.
  • Select “Country” field type.

“All setting options for Country Field are similar to Country Code for Tel Field.”