From this tutorial you will learn how to embed Google Maps to the website page with the help of Advanced Map widget of JetElements plugin.
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. Find this outstanding feature within JetElements!
What is the API key?
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
Go to Google Maps Platform and click the “Get Started” button.
Tick Maps and click the “Continue” button.
Enter your project’s name and click “Next“.
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.
Now let’s open the Google Cloud console by clicking the “Console” button at the top of the page.
In order for this feature to work properly your Google Cloud account has to be activated. You can do that by clicking on the “Activate” button in the top right corner of the page.
Choose your country and tick the checkbox in the Terms of Service section. Then, press the “Continue” button.
In the second step select your account type “Business” and fill in the fields with your data.
Google gives the 12 months free trial for Google Cloud Platform to everyone, but only with the billing data provided from your site. Don’t worry! You won’t be charged for anything without your permission. But they have to be sure that you are not a robot.
After you passed all the billing formalities let’s label required services for the Advanced Map widget to work properly. Click the Google APIs section and go to the Library.
In the Maps section click the “View All” option.
Open the Geocoding API block and click the “Enable” button.
Now go back to the API library and open the Maps JavaScript API and click the “Enable” option too.
Go to the Credentials and click the Credentials in APIs & Services.
Press the Create credentials button and pick the API key option from the dropdown list.
You can set the restrictions by pressing on the “Restrict key” button and adjusting the needed options.
Now you can copy the API key and proceed to the WP Dashboard.
Adding an API key to Advanced Map JetElements widget
Log in to WordPress Dashboard and here access JetPlugins > JetElements Settings block on the left. Open the Integrations tab and here you can see the Google Maps section, where you should paste the recently created API key in the corresponding field.
Congrats! From now you can embed Google maps at your site using JetElements plugin!