If your website uses Google Maps, then you've probably seen something along the lines of "Enter your Google Maps API key" during setup. You probably thought, "what is an API key and why do I need one?" Don't worry, we'll walk you through the steps required to get Google Maps up and running on your site.

What's an API Key and Why Do I Need One?

That's a great question! API stands for Application Programming Interface, and basically it's a way for your website to get data from a server – in this case, the Google Maps server. An API key is a way for Google to ensure that only authorized websites are using their services, and to bill the users if the service isn't free.

So in other words, your Google Maps API key is just a way to let Google know who is using their service and who to bill if necessary.

Don't Share Your Key

It's important that you don't share your API key with anyone. When you obtain an API key from Google (or anyone, for that matter), you're the one responsible for its use and any charges incurred. Most small businesses can use Google Maps for free, but if you let other people use your key then you're responsible for any charges they incur. So keep your API key to yourself!

OK, so let's get that API key so you can get up and running with Google Maps!

Sign into your Google account and go to your Google Cloud Platform Console. If you don't have a Google account you can create one for free. Once you've signed in to the Google Cloud Platform Console, you can choose a project. If you don't already have a project (most small businesses won't), you'll need to create one.

Select an account from your Google Cloud Console menu.
Create a new Google Cloud Platform project.

Enter your project name. It doesn't have to be anything fancy, it just needs to make sense to you. You can enter a location if you want to, but it's not required. Click "Create."

Create your new project.

Choose your new project from the list.

Choose your new project from the list.

Next, you'll need to link a billing account to your project. You may need to add your billing information if you haven't already. Google provides $200 of free usage per month, which means that you get about 28,000 map loads per month for free. Later on we'll discuss ways to limit the number of map loads to ensure that you don't get billed for usage. It's important to note that the $200 applies to all Google Cloud Platform services, so if you're using multiple services the $200 tier applies to all of them.

If you do have a high-traffic website you may have to pay for your Google Maps usage. We've included pricing as of February 2020 below – refer to the Google pricing page for the current rates. And of course, you can contact us if you need help.

Next you'll need to enable your Google Maps API.

Once you've enabled your Google Maps API it's a good idea to set a quota. This way, you can ensure that you're usage will remain below the billing limit. We recommend setting your daily quota to 1,000 but you can go a little lower if you want to be absolutely sure that you won't be billed.

We'll point out here that your website visitors will receive an error message  if you exceed your quota. So if Google Maps are a critical piece of your website or application it's probably better to set a realistic quota and pay for the required usage. Losing potential customers is probably more costly than the $0.007 you'll spend to display the map.

We're almost done! Let's create credentials for your Google Maps API key. To that, click on Credentials in the menu and choose your Google Maps JavaScript API key.

Finally, let's set some restrictions on your Google Maps API key. This step is optional, but it's a really good idea because even if someone should get hold of your API key they won't be able to use it on their website.

And that's it - we're finally done! You can copy your Google Maps API key into your website and be up and running. Give us a shout if you have questions or need help getting set up.

Matt Rife

About Matt Rife

Matt has worked on both sides of the tech/design divide. He started his career in IT and worked as a sysadmin and business analyst for more than 10 years before discovering the wonderful world of design. Now he mostly does UX design while dabbling in code and operating systems in his spare time.