How to create Google Maps API key to use Advanced Maps widget for Elementor

From this tutorial, you will learn how to embed Google Maps to the site with the help of Advanced Maps widget from JetElements.

From this tutorial, you’ll learn what is an API key, for what reason there is a necessity to get it and how to create your own Google Maps API key in order to have an opportunity to add Google Maps to your website.

What are the API keys?

API keys are the credentials that identify the project to which the application is making a call.

Google Maps API key is used to access Google Maps. Some applications or plugins using Google Maps require an individual token.

So if you need to use Google Maps on your site, you should go to the Google API Console and get your own key to embed a Google map.

Creating Google Map API key

Step 1 — Go to Google Maps Platform and click the Get Started button.

Step 2 — Tick Maps and click the Continue button.

Step 3 — Enter your project’s name and click Next.

Step 4 — Then you will be redirected to the billing page, but you can click the Cancel button in the popup window in order to create an API key for free.

Step 5 — You’ve been redirected to the Google Cloud and here you should click Go to Console button to access the APIs and click the Maps JavaScript API section.

Step 6 — Click the Enable option to use it.

Step 7 — Navigate to the Overview and here once more select Maps JavaScript API.

Step 8 — Open the Credentials tab and here locate the credentials of this API key. Copy them to the clipboard.

Great! Now you’ve got the Google maps API key for your project and you can paste it where it is required.

Adding an API key to Advanced Map JetElements widget

Step 1 — Log in to WordPress Dashboard and here access Elementor > JetElements Settings block on the left.

Step 2 — Open the Google Map Options tab and here paste the recently created API key in the corresponding field. Then click the Save button.

Congrats! From now on you can embed Google Map at your site!