Country Select & Phone Code for CF7

Description

Country Select & Phone Code for CF7 is a WordPress plugin developed by Bharanidharan M. It provides a country selector and international dialing code input for Contact Form 7 forms.

This plugin provides interactive vector country flags, telephone dial code prefixing, live search filtering, and two-way synchronization directly within Contact Form 7.

All country flags are stored locally within the plugin as vector SVGs. Zero external CDN or network requests are made, ensuring fast page load times and GDPR compliance.

Features

• Vector SVG Flags: Crisp vector flag icons rendered smoothly across displays without external dependencies.
• Two-Way Field Synchronization: Selecting a country in the Country dropdown automatically updates the Phone field flag and dialing prefix. Selecting a country in the Phone input synchronizes the Country field instantly.
• Strict Numbers-Only Phone Validation: Enforces digits-only input by blocking alphabets and invalid characters in real-time on keystroke and sanitizing pasted clipboard text.
• Automatic Dial Code Merging in Emails: Form submissions automatically prepend the selected country dial prefix (e.g. +91 9876543210) to the phone number in your Contact Form 7 email notification.
• Dedicated Admin Settings Panel: Configure default countries, preferred countries, country exclusions, and validation settings easily under Contact > Country & Phone Settings.
• Independent Default Country Controls: Set independent default countries for the Country dropdown and the Phone input to match your regional traffic needs.
• Preferred Countries Prioritization: Pin your most frequent customer countries (e.g. India, USA, UK, Saudi Arabia, Australia) at the top of the dropdown list for instant access.
• Instant Live Search: Type-ahead search enables visitors to locate any country quickly by country name, ISO-2 code, or dialing code.
• Theme-Agnostic Design: Harmonizes with your existing WordPress theme inputs with standard borders and smooth dropdown transitions.
• 100% Local & Privacy Compliant: All flags and assets are bundled locally with zero external CDN dependencies, ensuring fast performance and GDPR compliance.

Configuration

1. Add Fields to Your Form

1. Navigate to Contact > Contact Forms and edit your form.
2. Use the dedicated Country Phone or Country Select tag generator buttons in the editor toolbar, or insert tags manually:
   • Country dropdown: [country_select* your-country]
   • Phone input: [country_tel* your-phone placeholder "Enter your phone number"]
3. Save your form template.

2. Configure Email Notification

In your Contact Form 7 Mail tab, insert the corresponding mail-tags into your email notification template:
* Custom tag names:
Country: [your-country]
Phone: [your-phone]
* Tag generator auto-generated names:
Country: [country_select-123]
Phone: [country_tel-456]
* Standalone dial code (optional):
Dial Code: [country_code] or [your-phone_country_code]

3. Customize Plugin Settings

Open Contact > Country & Phone Settings to customize:
* Default country for Country selector and Phone input independently.
* Preferred priority countries pinned at the top of the dropdown.
* Exclude specific countries.
* Two-Way Field Synchronization toggle.
* Numbers-only phone validation toggle.
* Automatic dial code email merging toggle.

Technical details