My Google Map No Longer Displays Properly

Since June 16, 2018, all businesses which have Google Maps on their websites need an API key and to enable credit card billing on their Google account. Keyless usage, meaning any request that doesn’t include an API key ended on June 16 2018. What this means, is that any sites without an API key and billing enabled will no longer be supported, and any Maps requests will now show only low-resolution maps watermarked with “for development purposes only”.This is applicable to all users – even those with a simple map embedded on their website’s contact page.

The new system, known as the ‘Google Maps Platform is ‘pay-as-you-go’ and operates under the wider Google Cloud Platform. There is $200 free monthly credit which is enough to cover small business websites displaying a contact page map – up to 28,000 free loads of Dynamic Maps – but all business need to enable billing.

To get API key:

  • go to https://cloud.google.com/maps-platform/#get-started
  • choose Maps
  • Name your project e.g something like My website map and click on Next
  • you will be asked to create a billing account (if you do not already have one)
  • agree to terms and fill in your contact and credit card details
  • once filled in, you will be redirected to a page and your API Key will be shown on a popup like this screenshot

Google Maps API

You will then need to copy and insert the API code into your website. This will depend on how you have embedded the map. If your site is a WordPress one, many WordPress plugins and themes have a place where you can input this.

Restricting Access to your Key

Google Maps Platform will prompt you to restrict access to your API. This is to prevent unauthorised usage and quota theft, which this new pricing model encourages, you are also advised to restrict usage of the key to your website.

To add web browser restrictions to an existing, generic API key, do the following:

  • Go to the Credentials page of the Google Cloud Platform Console.
  • Select the project that contains the API key you want to edit.
  • On the Credentials page, from the list of API keys, select the name of the API key to edit the details of the key.
  • In the Key restriction section of the page, select HTTP referrers (web sites), follow the on-screen instructions to set referrers, then click Save.

More Information:

More information on billing at: https://cloud.google.com/billing/docs/how-to/manage-billing-account

To avoid a large bill, you can set a daily cap on usage: https://developers.google.com/maps/faq#usage_cap

Transition Period for Existing APIs

For existing API projects without a billing account, there is a “Google Maps Platform Transition Account”, created to help Google’s customers transition to the new pay-as-you-go pricing plan. This transition account enabled Google to provide these customers with a one-time credit, so that they could continue using Google Maps Platform up to the limit of the $200 free tier. Once this limit is exceeded, the billing account will shut down and you will lose access to the service. To avoid service interruptions, you should set your own billing account, and you will then benefit the $200 monthly free tier.

Do I really need an API? Can I just embed a map on my site instead? 

Yes, instead of going through all the above and giving Google your credit card details. when you really don’t necessarily need to, you can embed a map on your site. Just do a Google Maps search for your address, go to Share, Embed a Map, then copy and paste the code into your website. If you’d like a little more customization, then you may need a API and go through the above process, but if not, keep it simple and just embed the map into your site.