Adding Autocomplete For Address Fields in WordPress
Table of Content
Sometimes users feel difficulty to add autocomplete for Address fields in WordPress sites. This can be done by a plugin Address Autocomplete using Google place API. This plugin provides real time suggestions to the visitors as they type. This article provides you all the possible guidelines which can make you able to add Autocomplete for Address fields in WordPress
Adding Autocomplete for Address Fields in WordPress
Carefully read all the steps given below;
- Install and activate Address Autocomplete using Google place API. If you want to download this plugin CLICK HERE. For more useful plugins you can see our step by step guidelines for more suitable Google AdSense WordPress plugins in 2017
- After activation, go to Settings > Google Autocomplete page to configure plugin settings
- Now, you have to put Google Place API key which connects your website to the Google Maps and retrieve the autocomplete suggestions from Google’s database in real time.
- Now you should move to Google Developer Console website to create a new project.
- A pop-up will appear which ask you about the name of your project and you should use the name which can easily identify the project.
- After putting the project name, pop-up will disappear and you will be directed toward the new project within 2 seconds
- A list of popular Google APIs will appear from which you can select for your project. For this, you have to click on Google Places API Web Service
- An overview page will appear which explain how this API works
- You have to click on Enable button to continue
- At this stage, Google Developer Console will enable Google Places API for your project
- Now, you have to click on Create Credentials button to go ahead
- Click on What Credentials do I need? available on the next screen
- This time developer console will provide you the API key
- Copy that API key and paste it in plugins settings on your WordPress site
- According to the requirements, you still need to enable another API on your project
- Click on the Library in Google developer Console
- A list of Google Maps APIs will appear
- APIs overview page will appear where you have to click on Enable button to continue. Here is no need to put another API key.
Enabling Autocomplete Address feature:
The Autocomplete Address feature can be enabled to any form field created by WordPress Form Builder Plugin. Here, WPForms is used to enable Autocomplete address feature.
- You have to create a form that has address field or group of address fields
- Add the form you created to your website
- Now, go to the page where you added the form
- Here, right click on the address field and choose Inspect from browser’s menu
- Here, you will see Name, ID and CSS class values for address fields
- Copy these values and put in the Plugin Settings page
- For multiple fields, you have to put comma at the end of a value and paste another value for another field
- At the end, don’t forget to click on the Save button to store the changes you made
Finally, you can visit the page of your site and put an address, the form field will automatically show possible suggestions with help of Google maps and Google Places.
Hopefully, this article will help you to add Autocomplete for address fields on your WordPress site. If you have some experience and suggestions about this article, you can share with us via comments.