How to Setup Google Powered Address AutoComplete
Watch this video to see how to add Google Address Auto Complete to you lead capturer forms.
This guide will walk you through setting up the Google Address Autocomplete feature in your Lead Capture IO forms. Google Address Autocomplete streamlines the process of capturing accurate addresses, enhancing data quality, and boosting conversion rates by reducing the friction for your users.
Overview of Google Address Autocomplete
Google Address Autocomplete automatically suggests addresses as users begin typing, drawing from Google Maps' reliable data. This feature ensures address consistency and saves your users time, leading to higher conversion rates and better data quality for your sales team or CRM.
Key Benefits:
- Increased Conversions: Users can quickly enter addresses without typing the entire address manually.
- Improved Data Quality: Ensures addresses are consistent and formatted correctly.
- Easier CRM Integration: Address components are parsed into separate fields for easy CRM integration.
Steps to Set Up Google Address Autocomplete
Step 1: Getting Your Google Maps API Key
- Go to the Google Cloud Platform.
- If you don’t have an account, create one and sign in.
- In the Console, click on API & Services, and then click Enable APIs and Services.
- Search for Maps JavaScript API and click Enable.
- Also, search for Places API and click Enable to activate it.
- Go to Credentials, click Create Credentials, then select API Key from the dropdown.
- Copy your new API key.
Step 2: Adding Your API Key to Lead Capture IO
- In Lead Capture IO, navigate to your Lead Capture Form settings.
- Scroll to the Google Address Autocomplete section and paste your Google Maps API key.
- Click Save.
Step 3: Creating an Address Autocomplete Field
- After saving your API key, go to the form where you want to add the Address Autocomplete feature.
- Add a new step by clicking Add Step, and select Form.
- Name the step something descriptive like "Address Step," and click Next.
- In the form editor, click Add Form Field.
- From the left-hand panel, choose Google Address Autocomplete as the field type.
- Provide a name and label for the field (e.g., "Enter your address").
- Choose the address components you want to collect (Street, State, City, Zip Code). You can also hide fields you don’t want the user to see (like State or Zip Code).
- Save the form field.
Step 4: Optional - Restricting Address Autocomplete by Country
You can restrict address suggestions to a specific country:
- In the Google Address Autocomplete settings, enable Restrict by Country.
- Choose the country from the dropdown list (e.g., United States).
- Save your changes.
Step 5: Parsing Address Data into Hidden Fields
To prevent users from being overwhelmed by multiple fields:
- Go to each address component (e.g., City, State, Zip Code) and select Hidden Field in the field type settings.
- This ensures the address details are still captured but not visible to the user.
- Save each field.
Final Step: Testing Your Form
After completing the setup, test the form to ensure that:
- The Address Autocomplete feature is functioning.
- The address data is being parsed into the correct fields.
- Hidden fields are correctly capturing data without being visible.
Setup your Google Cloud Account
To give you the most reliable experience possible, we integrated directly with Google Maps. Before you setup your Address Autocomplete inside of the GetLeadForms Builder, you will need to first create your Google Cloud Account.
If you already have a Google Cloud account, then please skip to #2 Create a project and enable the API in your Google Cloud account.
- Navigate to Google Cloud and click on Console. If you don't already have a Google account then you will need to set one up.
- Upon clicking 'Console' you will be redirected into a dashboard where you will need to complete some setup fields for Google
- Next, Google Cloud is going to ask for your payment and billing details. Some Google APIs (including Google Maps API) charge for usage, and you need to enable billing before you can start using these APIs.
- Some notes on how the Google AP Pricing works:
- You pay only for what you use
- Here's the pricing breakdown for Google. Currently, it's $7 for every 1,000 requests to the API. That comes out to $0.007 per request. A request is defined as each time someone enters their address into your LeadForm if you're using the Google Address API. As you can see, this is very affordable and with all of the credits that Google provides, you may not have to pay out of pocket (depending on your traffic levels).
- Google Cloud offers a $300 free trial. The free trial applies towards the first billing account you create. During the free trial, your first Cloud Billing account is in "free trial mode" and no charges will be made against your payment method. The free trial ends after the trial period elapses, or when the $300 is spent, whichever happens first.
- In addition Google Maps Platform features a recurring $200 monthly credit that is applied to your account each month.
- Some notes on how the Google AP Pricing works:
After you setup your Google Cloud account, the next step is to create a project and enable the API in your Google Cloud account.
2) Create a project and enable the API in your Google Cloud account
- With your Google Cloud Account setup the next step is to create a project. To set up your project, navigate to the “Dashboard” section and click on “Go to project settings”.
- Next, click on 'Create Project'
- After you click 'Create Project' Complete the fields on the next page. The Organization and Location fields should already be filled in. The main field to complete is the 'Project Name' field. Give this a descriptive name like 'LeadForm Google Address'. Then click 'Create'
After the project is created, the next step is to enable APIs and Services in your Google Cloud Account.
- Inside of your newly created project, navigate to the “APIs & Services> Dashboard” section. Select “Enable APIs & Services”.
- Inside of the API & Services section, click on the blue link at the top of the page that says '+Enable APIS and Services'.
- After clicking on +Enable APIs And Services, you'll be directed to a page that looks like this.
- Search for “Maps Javascript API” and then click on the first option called 'Maps Javascript API'. Do not enable Maps Status API or Street View Status API.
- Upon clicking 'Create API Key ' from the dropdown, your API key will be automatically created. You'll see your API key in a new window like in the image below. Please copy this API Key or write it down somewhere. This will be added to your LeadForm inside of GetLeadForms in
Troubleshooting & Support
If you encounter any issues during setup or have questions, feel free to reach out to our support team for assistance.
Thank you for using Lead Capture IO!