Setting up a Google Maps API key and embedding a map in a page¶

Embedding a map in a page involves the following steps:

Obtain an API key¶

For Google’s detailed instructions on obtaining API keys, see https://developers.google.com/maps/documentation/javascript/get-api-key. Google’s new policy requires that you have a project with a billing account to obtain an API key.

Enable the following APIs:

On the Acquia CMS administrative interface, click Manage > Content > Add Content > Page. to create a page where you want to add a map.

Alternatively, you can edit an existing page.
In the Layout Canvas section, click the + sign.
In the Components pane, scroll down to Map components and click the the + sign next to the Google map component.

The Google map component is added to the Layout Canvas section.
Close the Components pane.
In the Layout Canvas section, double-click the Google map component and set its attributes based on your requirements.

For the Google map component, you can set the following attributes:
- Width
- Background color theme
- Padding top and bottom
After setting the attributes, click Apply.
To add a map marker, do the following:
1. In the Layout Canvas section, double-click the Google map component and expand Map marker.
2. In the Address field, add a complete address or type a precise location name.
  
  Note
  
  If your location name has spaces, use double quotes. For example “Acquia Boston”.
3. Click Find Coordinates.
  
  The Latitude and Longitude fields are automatically populated and a preview of the map is displayed.
4. In the Marker info window field, add your own text to be displayed on the marker window.
5. Add as many markers as you want to display on the map.