Jump to: navigation, search

Auto Address Search Service

Auto Address Search Service

The Google auto address search service, suggests several addresses i.e. when a customer/user starts typing address, autocomplete /auto-suggest will fill the rest.

The Address fields system will give auto-suggestion for the fields using the Google APIs, just like the way the browser gives suggestions to fill in details. However, a customer will have the liberty to ignore the provided suggestion and enter their own address details.

This auto address search functionality will be available on User Registration Page, Guest Checkout Page, and Shipping Address Page and manage Address on Cart section.

FrontStore3.png

This article walks you through the steps to set up the Google Auto-Address Search Feature –

Step – 1 Create a New Project

Visit https://console.developers.google.com/ and login with your Google Account. After a successful login, create a New Project from a ‘NEW PROJECT’ Button.

  • Enter your Project Name and Location to create a New Project.
  • You can also use an existing project rather than creating a new one.

Step – 2 Enable Places API

After creating the project, the page will redirect you to your project dashboard. Click on the ‘ENABLE APIS AND SERVICES’ button.

  • In the API Library, search Maps JavaScript API in the search bar and select the same. Click on Enable.

Google Address Auto-Complete1.png

Step – 3 Enable Maps JavaScript API

Similarly, enable the Places API.

Google Address Auto-Complete2.png

Step – 4 Get an API Key

To use the Places API you must have an API key.

  • Click the menu button and select APIs & Services > Credentials.

Google Address Auto-Complete3.png

  • On the Credentials page, click Create credentials > API key.

    The API key created dialog displays your newly created API key. Copy the key.

  • Click Close.

    The new API key is listed on the Credentials page under API keys.

To restrict the API key

  • Click on the exclamation icon on the API Key (as shown in the picture).

Google Address Auto-Complete4.png

  • In the ‘Edit Settings’ page find API Restrictions and restrict the key for ‘Maps JavaScript API’ and ‘Places API’
  • Click on Save.

Google Address Auto-Complete5.png

Step – 5 Configuration into Admin Panel

Admin can enable the setting from -

Admin >> Store Configuration >> Shipping Method >> ‘Shipping Address Setting’ button (top right corner) >> Auto Address Search Service.

  • Select that where Customer will get, the auto-suggestion option – it can be Address Line 1, Address Line 2, City, Zip Code, Company Name.
  • According to the select field, customers will get auto suggestions.

FrontStore2.png