Why do I require a Google Maps API key? And how do I get one? Both are great questions!
If you’ve been asked to set up a key and send it over to your developers for one reason or another, hopefully this guide will make that process as easy as possible.
Why do I require a Google Maps API key?
Basically, you’ll need an API key if you want to have a Google Map on your website where the bog-standard embedded IFrame is not custom enough.
With the IFrame option, you are extremely limited in terms of control; you can merely set what location the map should display. If you want anything else, you have to start utilising the Google Maps API.
Like what? Things like the styling of the map itself, multiple pins, custom pins, directions, etc. These are all awesome features that are unlocked once we start using Google Maps API.
Check out these two real-life instances we’ve coded up.
Case study: Hotel Juliani
Firstly, Hotel Juliani: https://www.hoteljuliani.com/.
On this widget on the homepage, we’ve restyled the map to use the blue of their branding. We’ve also added a custom pin for the hotel, and we’re displaying the route from the airport.
Case study: Club Quarters Hotels
The city page on the Club Quarters Hotels website is another great example: https://clubquartershotels.com/london.
We display the chain’s hotels on the map, all together using custom pins. The map is also restyled to match their branding colours. And, if you click one of the pins, you are linked through to that hotel page. Easy!
So, in order to have awesome maps like these on your site, we need to use the Google Maps API. To do so, we need to set up an account and also generate an API key. This API key is passed through to Google via the coding and allows these extra functions to be used.
I want one! So how do I get one?
There’s a caveat to be aware of: to set up an API key, Google requires billing information.
What, so I have to pay for this?!
Not necessarily. Google mainly uses this as a means of verification. They actually load up the account with a free $200 usage every month, and for 95% of websites, that’ll cover everything. To put it in perspective, that $200 credit will get you 28,500 map loads per month.
Let’s go through the steps!
