Autocomplete Location Field for Contact Form 7 vs Masks Form Fields

Autocomplete Location Field for Contact Form 7 is the easiest way to add a smart Google Address Autocomplete field to any Contact Form 7 form on your WordPress website. Powered by the Google Places API, this plugin delivers real-time address suggestions as users type — reducing typos, incomplete submissions, and user frustration. Whether you run a delivery service, real estate agency, booking platform, or local business, this plugin helps you collect accurate location data effortlessly. 🔗 Pro Version | Support | Get a Google Places API Key Why Use Autocomplete Location Field for Contact Form 7? Manually typed addresses are prone to errors. This plugin eliminates that problem by integrating Google’s powerful address intelligence directly into your CF7 forms. Users get instant, accurate suggestions — and you get clean, reliable data. Perfect for: – 📦 Delivery and shipping address forms – 🏠 Real estate and property listing sites – 📅 Booking and appointment forms – 🛠️ Service area and local business websites – 📬 Business contact and inquiry forms ✅ Key Features (Free) Google Address Autocomplete — Real-time suggestions powered by Google Places API Seamless CF7 Integration — Works natively inside the Contact Form 7 editor Simple API Key Setup — Connect your Google API key in minutes Lightweight & Optimized — Minimal impact on page load speed Easy Field Insertion — Add the autocomplete field with a single click in the CF7 editor 🚀 Pro Features Upgrade to Pro for advanced location control: 🌍 Country Restriction — Limit autocomplete suggestions to specific countries (e.g. US, UK, AU) 🗺️ Google Map Display — Show an interactive map when a location is selected 🧩 Separate Address Components — Capture Street, City, State, Country, and Postcode in individual fields 🏷️ Place Type Filtering — Restrict suggestions by type (e.g. establishments, geocodes, art galleries) 🌐 Custom Placeholder Translation — Localize your field placeholder text ⚡ Priority Support — Get fast, dedicated help from our team How It Works Install and activate the plugin. Navigate to Contact → Google Place API in your WordPress admin. Paste your Google Places API Key. Open any Contact Form 7 form editor. Click “Field Autocomplete” to insert the location field shortcode. Save the form and publish your page. That’s it — your form now has intelligent address autocomplete! Get your free Google API Key: Step-by-step guide | Official Google Docs Additional Information Support: codesmade.com/contact-us Pro Version: codesmade.com/store API Key Guide: codesmade.com/create-google-map-place-api-key

Add a class in the form field. Example of use with Contact Form 7: [tel your-phone class:phone placeholder "Phone"] Listing of classes available for use. ('span.start, input.start').mff_mask('00/0000'); ('span.date, input.date').mff_mask('00/00/0000'); ('span.time, input.time').mff_mask('00:00:00'); ('span.time2, input.time2').mff_mask('00:00'); ('input.date_time').mff_mask('00/00/0000 00:00:00'); ('input.date_time2').mff_mask('00/00/0000 00:00'); ('input.cep').mff_mask('00000-000', { clearIfNotMatch: true }); ('input.zip').mff_mask('00000'); ('input.phone, input[name="phonebr"]').mff_mask(PhoneMaskBehavior, nonoOptions); ('input.phone_us').mff_mask('(000) 000-0000'); ('input.taxid').mff_mask('00-0000000'); ('input.ssn').mff_mask('000-00-0000'); ('input.mixed').mff_mask('AAA 000-S0S'); ('input.cpf').mff_mask('000.000.000-00', { reverse: true, clearIfNotMatch: true }); ('input.cnpj').mff_mask('00.000.000/0000-00', { reverse: true, clearIfNotMatch: true }); ('input.money').mff_mask('000.000.000.000.000,00', { reverse: true }); ('input.money2').mff_mask('#.##0,00', { reverse: true }); ('input.money3').mff_mask('#,##0.00', { reverse: true }); ('input.money4').mff_mask('000,000,000,000,000.00', { reverse: true }); ('input.money5').mff_mask('#.##0', { reverse: true }); ('input.money6').mff_mask('#,##0', { reverse: true }); ('input.ip_address').mff_mask('099.099.099.099'); ('input.percent').mff_mask('##0,00%', { reverse: true }); ('input.percent2').mff_mask('##0.00%', { reverse: true }); ('input.percent3').mff_mask('990,0%', { reverse: true }); ('input.percent4').mff_mask('990.0%', { reverse: true }); ('input.percent5').mff_mask('#,##0%', { reverse: true }); ('input.percent6').mff_mask('#.##0%', { reverse: true }); Click here for more details on how to add custom mask. Optional – Added option for the format of the Brazilian phone number, with attribute name equal to phonebr. Credits jQuery Mask Plugin