You know that wonderful feeling when the Internet does the work for you? Like when you're typing in an address, and before you've even finished, the internet has basically read your mind and completed the whole address for you in a dropdown menu? Ah, so satisfying. That little piece of Internet magic is Google Address Autocomplete, and we'd like to show you how you can implement this in your Unbounce landing pages.
WARNING: YOU ARE NOW ENTERING DEVELOPER TERRITORY
Here's how it's done...
a. Create a New Project
b. Configure Key Permissions. In the example below, all pages on the domain ‘www.example.com’ will be able to use this API key. It is important that this is configured correctly or requests from your domain may be rejected by Google.
c. Copy your generated API Key
Step 4. Set up your Unbounce form with the following field IDs:
-autocomplete (this is your address field)
-street_number (Autofilled field. Can be hidden)
-route (Autofilled field. Can be hidden)
-locality (Autofilled field. Can be hidden)
-administrative_area_level_1 (Autofilled field. Can be hidden)
-postal_code (Autofilled field. Can be hidden)
-country (Autofilled field. Can be hidden)
Step 5. Save and publish your landing page.
Step 6. Celebrate
Now let’s test this puppy out! Like any other feature that you implement onto your page, you’ll want to see what effect it has on your conversion rates. We recommend running an A/B test and segmenting a small portion of traffic towards the page, just to be safe. Documentation on A/B testing can be found here.
Now that we’ve given you the tools, you’re officially one step closer to being a marketing extraordinaire (if you weren’t already). Once you’ve implemented this feature on your own pages, let us know what kind of impact this has on your conversions, or if you have any suggestions related to the Google Address Autocomplete feature, we want to hear ‘em!
Did you find this tip useful? Did you test this on your landing page? Let us know in the comments below!