Image

We all know adding free Google maps API request for our location in the websites and mobile apps or web server is easy using iframe tag from Google maps

But do you know how to add API key to your iframe embedded code on your website and the use?

We are here using API keys in Google maps because the Google Map API platform no longer support simple embedded code(keyless) access.

Now using advance version embedded API request with Api key uses Direction mode, Street View Mode or Search Mode and have different billings to get API key based on advance usage.

If you doesn’t add API key while publishing your google map on your site you will get the page as below:

Let’s get started with how can we get the API key for our website

Step 1: Login to Google Maps Platform in Google cloud

Step 2: Enable one of the checkbox on how you want your website map should

Step 3: Create your project folder

Step 4 : If you are the admin of your website can only access and billing should be done to get your API key.

Step 5: It will generate an Api key for your website

Step 6: You can see an overview of your API key process

Step 7: You can see your API key generated in API’s section -> Credentials

Step 8: Now you have to add your API key for your AMP page including all other tools using iframe code for example:

iframe tag :iframe src=”https://www.google.com/maps/embed?pb=locationcode/v1/place?key=your API key

If you add the API key in the Google maps embedded code it will show your map as our website has below:

Receive latest marketing insights, data and inspiration

View Blogs ➞ Subscribe ➞

Start your Project Today