Contact Form 7 is one of the most popular plugins on the WordPress repository. At the time of writing this article, this plugin has crossed 5+ million active installations. One of the reasons for this immense popularity is the plugin’s add-on. The author of this plugin has developed several supported add-ons for the Contact Form 7 plugin. Using these add-ons, we can easily add new features to the existing contact form.

As an example, let’s say you want to add a Country field to your contact form. There are around 200 countries in the world and adding all of them statically is not an easy task.

To resolve this problem, the author of the Contact Form 7 plugin has created a Listo plugin. Using the Listo plugin you can add a Country field to your contact form in a matter of minutes. Let’s see how to add a country list in the Contact Form 7 plugin.

Why need a Listo Plugin?

Sometimes website owners want to get a user’s location along with other details from a contact form. To get the location of a user, your contact form should have a Country field. This field will be a dropdown from which users can pick up their country.

By default Contact Form 7 plugin provides a select tag for adding the dropdown values. This select tag is fine if you have limited options. When it comes to adding a country list one can’t use this option because of a long list.

The Listo plugin makes this task super easy. Just add one statement and you are done.

By the way, I also developed an add-on that connects Contact Form 7 with Google Sheets. It helps to store your contact form entries directly to Google Sheets. If you are someone who wants this functionality then check out my plugin.

Add Country List to Contact Form 7 Plugin

Install and activate the Listo plugin. This plugin has no setting page. Just plug it in and you can use its features.

Next, to insert a country list you need to add attributes for the select tag. Head over to the edit screen of your contact form and add the select tag as follows.

[select your-country data:countries]

Here data:countries do magic. It populates a list of countries in your dropdown. Now check your contact form. It should have the country dropdown.

How to Set the Default Country

Let’s say you want to keep a specific country selected by default. In that case, you need to add a jQuery code to your JS file. First, get the option value of a country you need to set as default. A user can take this value from inspecting the dropdown and copy it from the option value.

Next, using the class wpcf7-select you can set the default country selected in the contact form. Add the below code to your JS file.

jQuery(function($) {
    $('.wpcf7-select').val("India"); // here we set India as a default country
});

That’s it! Now if you check your contact form you should see ‘India’ as a default selected country in the country dropdown.

Related Articles

• Remove Contact Form 7 CSS and JS When Not Needed
• Redirect to Thank You Page after Contact Form 7 Submission
• MailChimp Integration with Contact Form 7 Plugin

If you liked this article, then please subscribe to our YouTube Channel for video tutorials.