How to register a Google Maps Api key

Google recently changed the way their map service works. New domains which want to use Google Maps need to register an API key for their website. Older domains should work fine without this API key.

In this tutorial we provide a  list of steps to follow. It’s actually not that hard at all.

First of all please make sure that you are running WordPress 4.5.3 or higher and Enfold 3.7 or higher.

Step 1

First of all go to: https://developers.google.com/maps/documentation/javascript/get-api-key#key

You will notice the Blue button with the label “GET A KEY”. Press it.

step_1

 

Step 2

If you are not already logged in google will ask you to do so.

 

step_2

Step 3

The google API project site will open once you are logged in. Set the dropdown menu to “Create a project” and press the continue button.

 

step_3

Step 4

Now you need to enter a name for your API key. This name can be anything and is totally arbitrary. If you want you can also enter your domain name so only requests from your domain with that key will be accepted.

IMPORTANT: If you want to enter your domain make sure that you use the format that google already suggests.

Some examples:

The first thing you should always try is to simply enter your full domain name with an asterisk at the end. In our case this would be http://www.kriesi.at/*

If this does not work you can always try a more generic approach:
If your site is running on http://www.kriesi.at then entering *.kriesi.at/* (example of a domain with www) should also work

If your site is running on http://kriesi.at (without the www) you can also enter kriesi.at/*

If you encounter problems we recommend to remove all restrictions first and see if that helps, and then add your restriction back in. Chances are high that if it worked without restriction and does not with restriction you used the wrong syntax.

 

step_4

Step 5

Thats it. Google will show you your API key in a popup and you can now copy it

 

step_5

Step 6

Paste it in your Enfold Backend at “Google Services->Google Maps API Key”

step6

 

You can now use the google maps element in your template builder and the google maps sidebar widget