Jump to content
Invision Community

Community Enhancements: Google Maps

Enabling integration with Google Maps provides autocomplete functionality when a user enters an address (which is particularly useful if you are using the Commerce application) and can display maps when looking at IP addresses and elsewhere.

Warning

You need to enable three different API services. Make sure you follow all of the following instructions carefully.

To enable Google Maps integration:

  1. Go to the Google Developers Console and sign in if you are not signed in already.
     
  2. In the top-right corner is the project selector.

    Screen Shot 2016-06-27 at 11.42.37.png

    You may already have a project if you have previously integrated Google login on your community. If you do not have project, click the dropdown and create one.

    Screen Shot 2016-10-14 at 13.27.33.png
     
  3. Select "Enable API" in the top left of the screen
    Screen Shot 2016-10-14 at 13.28.45.png
     
  4. Click the "Google Maps JavaScript API" link and then click the "Enable" button.

    Screen Shot 2016-06-27 at 11.43.22.png 

    Screen Shot 2016-10-14 at 13.28.45.png
     
  5. Click "Go to Credentials" and create an API key for a web browser. Make sure that "Google Maps Javascript API" is selected.

    Screen Shot 2016-06-27 at 11.44.40.png

    2016-10-14_13-35-25.png
     
  6. You will be presented with an API key. On your community, to AdminCP > System > Community Enhancements > Google Maps and fill this into the "Google Maps API Key" field.

    Screen Shot 2016-06-27 at 11.58.29.png
     
  7. Select 'API Manager' in the top left of the Google Developers console and repeat step 3 to 4 for the Google Static Maps API, Google Maps Embed API and the Google Maps Geocoding API. (You may need to select 'more' under the Google maps APIs to see these)

Screen Shot 2016-06-27 at 11.46.25.png

2016-10-14_13-30-13.png

Edited by Andy Millne

  Report Guide


×