Google has recently announced that they have changed their policy in regards to accessing and using their Maps API without an access key. Starting June 22, 2016 all new domains using the Maps API must register an account with Google and register their site for access to use the Maps API. So if you are receiving this error message instead of a map you must create an account with Google and setup access keys for your site. Google does provide documentation on how to get a key but they are pretty sparse, lacking on detail. This FAQ will provide more detailed step by step instructions.
Step 1 – Google Account
You must have a Google account or Gmail account. If you do not have one, you can create a Google account without a Gmail account here.
If you have a Gmail account, then you already have a Google account. To login to the Google API Console you will use your Gmail login email and password.
Login to the Google API Console.
Step 2 – Get a Key
After you have logged in, click the “GET A KEY” button below.
Step 3 – Create a Project
The “GET A KEY” button should take you to the Google API Console where you can create a new project, click the “Continue” button.
If you receive an error when clicking the “Continue” button, dismiss the error. In the Upper right corner of the page you should see a dropdown that says “Select a project”. When you click it, the bottom option will be “Create a project…”. Select it.
A popup will be displayed allowing you to give your project a name. Give your project a name and click the “Create” button.
After a few moments (be patient) your new project will be created and the page will reload to the project’s “Dashboard” page.
Step 4 – Create the Browser API Key
Click the “Credentials” link in the left-side navigation panel.
After you click the menu item a new popup should be displayed. Click the “Create credentials” button and select the “API key” option.
Another popup should be displayed which allows you to choose the type of key to create; click the “Browser key” button.
You will be shown the settings page which will allow you to configure the Browser Key.
Give your Browser Key a name.
This next part is important; you need to setup the “Accept requests from the HTTP referrers. This is marked as optional, but if you do not set up this option, anyone will be able to copy and use your Browser Key.
I recommend using
http://domain-name.com/* as the referrer; change
domain-name.com to your website address. The preceding
http:// and trailing
/* are important and should not be left off otherwise your Browser Key may not work because it will not be able to validate the referrer. You can now click the “Create” button.
The page should refresh and show a popup which contains your Browser Key.
Important: Copy this to a text file or email where it will be easily accessible as you will need it later in this tutorial. After you have copied it, click the “OK” button to dismiss the popup.
Step 4 – Create the Server API Key
Creating the Server API key process is nearly identical to creating the Browser Key you followed in Step 3. You should still be on the Credentials page in the Google API Console. Click the “Create credentials” button and choose the “API key” just as you did before but this time you will click the “Server key” button.
Just as you did in Step 3, give the Server Key a name.
If you have a static IP address for your website domain, you should add it to the “Accept requests from these server IP addresses” section. If not, it is safe to leave this blank.
Click the “Create button”. The page should refresh and show a popup which contains your Server Key. Copy this to where you copied your Browser Key as you will need it later in this tutorial. Click the “OK” button.
Step 5 – Enable the Maps APIs
Now that you have created the Browser and Server keys for your site, you need to enable the APIs that you are going to use which are required for displaying Google Maps. Click the “Library” link in the left-side navigation panel. The page will refresh displaying the many API’s Google provides. We are only interested in the following two:
- Google Maps Geocoding API
The first you will find under the “Google Maps APIs” section. The second will be shown if you click the “More” link.
Click on each of these and then click the “Enable” button to activate the API.
Step 6 – Add Keys to Settings
Finally, navigate to the Connections : Settings admin page and paste the keys you copied in Steps 3 and 4 into the “Google Maps Geocoding API” section. Be careful to paste the correct key into the corresponding field. If you paste them in backwards, they will not work.