damiarita

Thanks!

Please, consider a plugin review! ??

Hi @jefcx81

I just released a new version of the plugin.

In your email, you can now use the next tags

• In order to get the country name use [{your-phone}-cf7it-country-name] where {your-phone} has to be replaced by the name of your tag
• In order to get the country code use [{your-phone}-cf7it-country-code] where {your-phone} has to be replaced by the name of your tag
• In order to get the phone number without the country code use [{your-phone}-cf7it-national] where {your-phone} has to be replaced by the name of your tag

Let me know how it works out

Hi @takayukister,

Great!

Is there a way of making the newly created special mail tags visible on the contact form editing page, under the “Mail” tab, right where it says: “In the following fields, you can use these mail-tags:”

Thank you for your quick reply

Good idea!

Hi @justinthomasonline,

Unfortunatelly, this possibility is not available.

This wordpress plugin uses a jQuery plugin (https://intl-tel-input.com/) This JS is, by default, adding the placeholder.

You can contact the jQuery author to see if there is a possibility to disable it.

However, I think it is important to have the placeholder, as it reassures the user to introduce his/her number without the country code.

Can you post a link to your website and tell why you don’t want it?

Thanks

Hi @jefcx81

Thank for using this plugin.

I was thinking about your idea and in my opinion it will be great.

I could modify the plugin so that it creates hidden inputs with the information you need.

However, I don’t know how to make this values recoverable via CF7. I mean, I don’t know how to create the [your-country] tag for you to use it in your email.

I opened a support forum in CF7 to see if we can get a clue. This is it: https://www.ads-software.com/support/topic/multiple-mail-tags-for-one-field/

As soon as we get an answer, I will issue a new version with this feature.

I’ll let you know

Hi @du30,

This wordpress plugin is based on this jQuery plugin https://jackocnr.com/intl-tel-input.html

https://jackocnr.com/intl-tel-input.html has its own CSS and I simply import it from a CDN.

If you want to modify the styles, my suggestion is that you add another CSS file enqueued after the plugin’s file and modify the style. A easy way to do that is with jetpack. If you install this plugin, under “Appearance” in your Dashboard, you will have an additional CSS editor. You can write your styles there.

In this case, it is impossible to modify the CSS file because it is served from a CDN. However, in general, it is a bad idea to modify a plugin’s file. This is because, everytime a new version comes out and you update your site the old files are replaced by the new version and those wouldn’t have your modifications.

I hope it helps!

Glad to hear!!

Happy blogging!

Hi shahadatuk,

Sorry for the late reply. I have missed your first post. I just received the notification email of the second one.

Here is what happens:
The javascript of the plugin executes this code when the page is loaded:

jQuery(".wpcf7-intl-tel").intlTelInput({
  initialCountry: "auto",
  utilsScript: wpcf7_utils_url,
  geoIpLookup: function(callback) {
    jQuery.get('https://ipinfo.io', function() {}, "jsonp").always(function(resp) {
      var countryCode = (resp && resp.country) ? resp.country : "";
      callback(countryCode);
    });
  }
});

Aparently, the input in your popup is does not exist yet at that time.
There are two ways you can solve it.

1. When you execute the JS that opens the popup, make sure you execute the code above too
2. Make sure your input is there in a hidden div with the original html so that the first time the above code is executed, it finds id

I hope this fixes your issue.

Please, let me know how it ended up.

Hi igida,

Did you try it?

Hi igida,

This is weird because all the websites I manage where I installed the plugin are working properly…

I have looked at your picture and checked your website.

If hadn’t said anything, I would say my plugin has not been installed or activated. Because:

1. The button doesn’t appear when you edit the form.
2. The plugin is not adding the CSS and JS files to your website.

Could you please check again that International Telephone Input for Contact Form 7 is activated? Otherwise, could you tell me what WP version you use and what CF7 you have installed? Do you have other CF7 related plugins?

Great!

Consider a positive review to the plugin, please.

Enjoy your programing!

Hi,

I visited your page. The input displays the flags now. The update seems to have fixed it.

There is some CSS conflict between the plugin’s stylesheet and your theme’s stylesheet.

Some of your theme’s rules apply to form.wpcf7-form input[type=text], form.wpcf7-form input[type=email], form.wpcf7-form textarea unfortunately, the input the plugin creates has type=”tel”. Modify your CSS to include this case.

If you need further assitance, please let me know!

Hi Ahmet,

The issue was caused by the order in which the JS files of the plugin were included in your page.

The library was included after the main JS file. So, the functions defined in the library were not available for the main file which caused it not working.

I updated the plugin so that this dependency is enforced. Try to update the plugin (wordpress cache might take some minutes to realize there is a new version).

However, i noticed that you use bwp minifier plugin. I am not sure how much attention in pays to the dependencies. At the end, the important fact is that the file with this handle wpcf7-intl-tel-lib-js comes before wpcf7-intl-tel-js.

Let me know if this fixes it!

Despite selecting automatically the country the user is connecting from, it is true that UK and USA are moved to the top of the list.

Is this top-of-the-list what you want to change?