How to generate Google Maps API Key for WordPress?

Updated on October 5, 2023 by Ananda

Table of Contents

In order to use The Plus Blocks for Gutenberg Google Map Block, you must have a Google Maps API key.

So let’s see how to get a Google Maps API key.

To create a Google Maps API key click here.

From there, click on the Go to the Credentials page button.

To check the complete feature overview documentation of The Plus Blocks for Gutenberg Google Map block, click here.

Requirement  – This block is a part of The Plus Blocks for Gutenberg, make sure its installed & activated to enjoy all its powers.

Create a New Project

From the Credentials page you have to create a new project.

google map api step 1
  1. Add a Project name.
  2. Enter your location and click on the Create button.

Set up Billing

Once the project is created, on the next page, you have to set up billing information for your project.

google map api step 2

Step 1

  1. Choose your country.
  2. Agree to the Terms of Service and click on the Continue button.
google map api step 3

Step 2: Create a new billing account

  1. Choose a name for your billing account.
  2. Verify the details and click on the Continue button.

On the next page, add your billing information.

google map api step 4
  1. Choose your Account Type.
  2. Fill in your Tax information.
  3. Add your personal details.
  4. Add a payment method (For example Credit Card).Click on the Submit and Enable Billing button.
google map api step 5

On the next page, choose your project’s billing account and click on the Set Account button.


Then Google Maps will ask a few questions related to your project, like your industry, the platform you are building the project for, fill in the answers and click on the Submit button.

google map api step 6

On the next page, you will get your Google Maps API Key, copy the API and click on the Go to Google Maps Platform button.

Now you have your API key but as per Google Maps recommendation you need to restrict the usage of your API key by limiting its usage to the needed APIs for your application.

Protect your API (adding Maps Embed API)

Now on the next page, Google Maps will automatically ask you to protect your API key.

google map api step 7
  1. Select restriction type as API restriction.
  2. And from the Limit usage dropdown, select Maps Embed API and click on the Restrict Key button.


Now the usage of your API key has been restricted. To check the list of enabled APIs for your project click on the APIs from the left panel and it will display all the enabled APIs.

google map api step 8

Now you can use your newly created Google Maps API Key with The Plus Blocks for Gutenberg Google Map Block.

To do this, go to

  • The Plus Settings → Extra Options 
  • Scroll down to Google Map API Key section and paste your API key.
  • And on the other Google Map API Key section choose Show from the dropdown then click on Save.
google map api

Also, check out How to Remove Google Maps API Error of browser console in WordPress.