Do you have an embedded Google map with a pin marking your location on your "how to find us" page, and have you checked it's still working OK? If not, you might want to check with your web developers to see if your site needs an API key.
Google's map service is extremely useful for allowing you to drop a map onto a web page which can zoom in and out and be used to generate directions or to pinpoint a number of location. Here's a map on the Lostwithiel website showing local businesses, and here's a map on the Royal Oak Inn website allowing visitors to find them.
However, from June 11th 2018 Google changed the rules about how maps (in fact, all their products) work. Whereas before you could display the maps anonymously and for free, now you must register for an API key and attach it to a billing account.
We've had to revisit nearly all our websites to change them to use API keys. It's a pain but that's the danger of using third-party systems, and it was inevitable that Google would eventually turn this into a paid service. For now, at least, there is $200 free credit every month and charges only start when service use is very high (see Google's map pricing table).
How to set up API keys
To set up a billing account, log into the Google API Dashboard and go to Billing from the top left pop-out menu. Once that has been approved, you can start creating Projects.
Each Project must have the libraries that you wish to use enabled. From the left pop-up out menu choose APIs & Services then Library, search for the APIs you need then click Enable for each one. We use:
- Maps JavaScript API - this allows you to place pins on an embedded map at specified geographic coordinates
- Geocoding API - this allows you to convert an address or postcode into geographic coordinates
Once your libraries are enabled, you can create your API keys. From the left pop-out menu choose APIs & Services then Credentials. Click the Create credentials button and choose API key.
We create separate API keys for Maps Javascript API and Geocoding API so that we can restrict them. The Maps Javascript API is restricted by HTTP referrer so that it only runs on the specified website. The Geocoding API is restricted by IP address so that it only runs on our web servers.
You can share management of your API keys with your team by choosing IAM & admin from the left pop-out menu, then selecting IAM. Add the Google account details of everyone who needs access and the appropriate access level.
Using API keys on your website
Finally, you can add your API key to your calls to Google APIs.
Here's a call to Google Maps Javascript API with the key included:
<script async defer src="https://maps.googleapis.com/maps/api/js?key=[your key goes here]&callback=initialize" type="text/javascript"></script>
Here's a call to Google Geocoding API with the key included:
$geocode_url = "https://maps.googleapis.com/maps/api/geocode/xml?address=[your address goes here]&sensor=false®ion=uk&key=[your key goes here];
$xml = simplexml_load_file($geocode_url);
Google Developer Console :(
Obviously, this is quite a technical set of instructions and we find Google's Developer Console particularly difficult to navigate around. It's not for the faint-hearted and we wouldn't recommend using it unless you have to. It's hard to find anything, there are no clear steps to follow and there's minimal documentation. The interface changes regularly so any help guides are often out of date.
We don't expect any of our clients to have to do this and it's part of our ongoing maintenance of their site to keep an eye out for things like this and make changes as and when required. At least it's not quite as bad as the Google Webmaster Tools interface :`(
The joys of being a web developer!