Menu

Flexible Map

Flexible Map

Easily embed Google Maps in WordPress pages and posts

API keys

Google requires you to have a valid API key and a Google Cloud Platform billing account to access the Google Maps JavaScript API. Depending on how much traffic your website gets and what sorts of map queries it does, it might cost nothing — or it might cost a bundle. Read Google’s blog post Introducing Google Maps Platform for more details.

To get your API keys and set up billing details, visit the Google Maps Platform and create a project. You will be asked to select which APIs you need to use:

Google Maps Platform API selection
Google Maps Platform API selection

Tick the following:

  • Maps — you’ll be needing this one or maps won’t work!
  • Routes — if you will be using the Directions features of the plugin
  • Places — if you will be creating maps by address, rather than by coordinates

Select or create a project, and set up billing for it. Once you’ve set that up, follow the instructions for getting an API key.

When you have created your API key, copy it and paste it into the settings for the plugin (Settings > Flexible Map):

Flexible Map settings
Flexible Map settings

You must set the JavaScript API key for maps to work. If you create maps by address, rather than by coordinates, it is recommended to also create an API key for the server.

Key restrictions

By default, when you create an API key it has no restrictions. Now that Google can bill you for your usage, it’s a good idea to restrict where your API key can be used, so that nobody can steal your API key and use it on their website. Because the API uses JavaScript and runs in the web browser, anyone can see your JavaScript API key and steal it — so you’d better add some restrictions!

Restricting the JavaScript API key

The key you use for the JavaScript API should be restricted by referrer, so that it works on your website and any test sites you have, but no other sites. Refer to the Google Maps API guide to see how you can restrict your API key by referrer.

Adding a Server API key

Once you’ve restricted your API key by referrer, you won’t be able to use it as a Server API key. The Server API key is used to reduce the number of requests made by a map, by resolving the address to coordinates on the server and remembering the coordinates for a while. If you make maps that use an address, you really should add a Server API key!

It doesn’t really need restrictions because it will be a secret key only used on the server and never seen in a web browser, but you can restrict it by the IP addresses of your website if you prefer.