About Google Places Autocomplete
The Place Autocomplete service is a web service that is used to provide autocomplete functionality for text-based geographic searches, by returning places such as businesses, addresses and points of interest as a user types.
NOTE: Make sure to check the Google Places Pricing before start using this service, as it is not free!
Using Places Autocomplete in a form
One of the most popular use cases is to add the Google Places Autocomplete field in a form, where the users enter their address. Here’s an example checkout form we added on our page:
Adding Places Autocomplete on the page
There are two ways of adding the Places Autocomplete on your pages. One way is to use the add new component button and select Google Places Autocomplete from the Forms category:
The other way is to convert an existing text input into a Places Autocomplete.
We will use this way as we’ve already built our form. Select your input, then click the Make Google Places Autocomplete button:
Setting up Places Autocomplete options
You will see its properties in the Properties Panel.
First, let’s start with pastng the API Key. You need to create an API Key and enable the Places API and Maps Javascript API in the Google Cloud Platform
Paste your API Key when you are done:
We won’t show the address on Google Maps on our page, so we leave the Map dropdown empty:
Then select a country, where you want to search the addresses / places:
And select the place type:
We want to use the autocomplete for addresses, so we select Address:
Save your page and you are done!
You can see the results in your browser:
Last updated: