You want to embed Google Maps on the website, but only see an error message? Then the Google Maps API Key is your literal key to success! If you are wondering where to get such a key, what you have to do for it and how much it costs, you are right here. We show you step by step how to generate your personal API Key.
What is an API Key?
So that you know what you are actually doing here: an API is an interface between two programs. When you access Google services with your website, it happens through such an interface. The Maps API Key is simply there to enable you to use the interface – without it, the interface is "closed" to you.
If your curiosity is now piqued, take a look at one of our articles where we explain how APIs work in simple terms.
What do you need to create an API Key?
Basically, you only need one thing to create a key: a Google Account. If you don’t have an account yet, you can create one here. In addition, during the creation of the key, sooner or later you will be prompted to create a Billing account select. This is mandatory to make your key work. So have a credit card or bank account ready.
If you are not asked for your billing account when creating your key or if you want to add an account later, you can easily find the corresponding function via the search bar. Enter "create new billing account" there, then you will be automatically redirected to the appropriate form.
Surely you ask yourself now: "Wait a minute, the API Key costs money?" Don’t worry, we’ll get to that in a moment.
If the Google Maps API Key is free?
Exactly? No, the key is not free. The days of free maps are indeed over: embedding maps on your own website may incur fees since 2018. However, since Google provides a free monthly credit, this only affects a few. Only from 25.000 calls per month, the key is a burden on your wallet.
If your traffic is in such high regions, you can think about restricting your key from a certain number of views – more on this later. In any case you should take a look at the prices of the Google Maps API.
Create a Google Maps API Key in 5 steps
Enough of the preface! You are here because you need an API Key! Don’t worry, it’s not far: you only have to go five steps to get your personal key.
1. Call Google Cloud Platform
The generation of the API key runs like many other Google services via the cloud platform. You can find it at https://console.cloud.google.com/. Log in there with your Google account and you’re ready to go! You should arrive at a dashboard like the one below.
2. Create a project
Now create a separate project for the website you want to integrate Maps into. If you have more than one website, create more than one project. Each web project should get its own API Key.
Click on the field to the left of the search line and in the following window on "New project". After that, all you need to do is assign a project name and click "create".
3. Enable APIs
Now that you’ve created your project, you need to activate the APIs you need. Depending on which features of Maps you want to use, you need different APIs.
Open the sidebar by clicking on the hamburger icon in the top left corner and then open the API library via "APIs and Services → Library".
There you can either display all Maps APIs or use the search function.
For the integration of maps on websites i.d.R. The following APIs are interesting:
- Geolocation API: allows you to determine the user location
- Places API: allows you to search for addresses on the map
- Maps Static API: allows you to include a static map
Which APIs you really need depends on your project. But activating it is very easy: You click on the required API and can’t miss the corresponding button afterwards.
4. Create API Key
Here we are – your API key is just a few clicks away! Go back over the sidebar, but this time go to "APIs and Services → Credentials". There, clicking on "Create credentials" will open a dropdown where you will of course select the API key.
A few moments later, you should get the following message:
This is the code you need to insert in your WordPress plugin or in the HTML code of your website. Copy it best already. But you are not quite done yet.
5. Restrict API keys
If you would simply leave the Cloud Platform now and integrate the key into your website, there would be a security problem: Anyone who somehow gets hold of your code could use it for his projects – and you would be surprised about the bill from Google at the end of the month. To make sure that doesn’t happen, you need to limit your API key usage. To do this, click on "Restrict key" and make two changes on the following page.
- limit the key to your URL.
In order for the key to be used only on your website, you must tell Google your URL. To do this, select "HTTP reference URLs (websites)" under Application Restrictions and enter the URL of your website under "New item". Follow the example pattern – so replace everything before the first dot and everything after the first slash with an asterisk. This covers all the subpages of your URL.
- Limit your key to the APIs you need.
You can never be too careful: At the bottom of the page, under API Restrictions, select the APIs you enabled in step 3 of this guide.
Now really nobody can use your key except you.
Congratulations! You now have your own API key and can use Google Maps on your website. We are glad if we could help you with this guide. If you still have questions or need help elsewhere with your site, feel free to contact us for a no-obligation consultation.