How to Add Google Maps to WordPress: Beginner’s Guide (2025)

Want to add Google Maps to your website?

By the end of this guide, you will be able to easily add Google Maps to your website in different ways from using a plugin to a theme.

Here’s what we’ll cover:

• Why add Google Maps
• Google Maps plugin
• Google Map’s embed feature
• Using a theme/builder that supports Google Maps

Ready? Let’s get started.

Why add Google Maps to your WordPress site?

The short is that it can significantly improve user experience by giving visitors clear directions and a visual representation of your business location.

It also boosts local SEO and increases your visibility in local search results, potentially driving more traffic to your site.

Furthermore, interactive maps can serve as a valuable resource for content, highlighting routes, attractions, or points of interest related to your site’s niche.

Method 1: WordPress Google Maps plugin

What I like about this method is that it is user-friendly and doesn’t require coding skills.

Although there are a lot of respectable Google Maps plugins, for this method, we will be using the WP Go Maps plugin (formerly WP Google Maps) as an example:

Step 1: Choose and install the plugin

Naturally, you must first install the plugin.

On the dashboard:

• Go to plugins > add new
• Search for the plugin’s name
• Click the install button

Like this:

After activating the plugin, you can access its settings by locating the maps option in the sidebar of your dashboard.

Step 2: Configure the plugin

You need to access its settings for you to be able to configure the plugin.

Go to maps > edit in the dashboard:

You will need to enter a Google Maps API key.

Click the get an API key button and follow the subsequent prompts:

Make sure to enter the API on the field provided once you have it. 🙂

If this is your first time creating a Google Maps API key, you will have to visit Google and enable the API key from there.

⚠️ Note: Google Maps will require billing information for authentication and security purposes.

Step 3: Create a new map

After successfully adding the API key, the WordPress map plugin will automatically create your first map, aptly named as such.

This is the configuration screen where you can set up your map:

There are a lot of things you can define here, such as:

• Map’s dimensions
• Select the type of map (such as a roadmap or satellite)
• Adjust the zoom level
• Set the center point

You can add detailed markers to your map with the advanced markers tab at the bottom (section beside the actual map).

This allows you to input location details and choose a custom icon for each marker, enhancing the map’s interactivity and usefulness.

⚠️ Note: For the free plan of this plugin, you can only edit this first map. You can add unlimited maps with the pro plan though.

Step 4: Paste the shortcode

From the config page, you can see the shortcode under the map settings:

• Copy this shortcode
• Edit the page or post where you wish to display the map
• Paste the shortcode directly into a shortcode block

For example, if you’re using the Gutenberg Editor:

Don’t forget to preview the page or post first to confirm that the map is displayed correctly and as expected.

If you are satisfied with how the map looks in the preview, you can publish or update your page or post and make the map visible on your live site. 👍

Method 2: Google Maps’ embed feature

You can easily embed Google Maps using the iframe code provided by Google Maps to embed a specific location directly into your WordPress content.

Step 1: Find your desired location

Start by going to the Google Maps website.

Once there, use the search bar at the top of the page to enter the address or name of the location you wish to display.

For example:

After searching, click on the desired location to view it on the map.

Step 2: Access the embed option

Proceed by locating the share button, which is usually found on the left sidebar or under the location name.

In the popup that appears, select the embed a map tab — this will show you the iframe code that you can use to embed the map.

Like this:

You can then customize the size of the map to ensure it fits well within the design of your site.

There are four options here:

• Small
• Medium
• Large
• Custom size

Pick your option:

If you choose the custom size option, you can enter the height and width, and even preview the actual size (this will open another browser window).

Step 3: Copy and embed the code

If you’re satisfied with the size, you can then click the copy HTML button to copy the iFrame code to your clipboard.

This code is what you will embed into your WordPress site.

Once again, open the page or post where you want the map to appear:

• Add a custom HTML block
• Paste the embed code there

This process integrates the map directly into your content, which displays it as a part of your page or post.

Nice and effortless! 😅

Method 3: Using a Google Maps theme/builder

Well, if you’re planning to switch to a theme that includes built-in Google Maps capabilities, then this method might be the best one.

Step 1: Choose a suitable theme

Start by choosing a WordPress theme that has built-in support for Google Maps.

The following themes/builders are known for this functionality:

• Divi
• Elementor
• Travelmatic
• Estato
• Reales WP

For this example, I will be using Divi simply because I already have it on my demo website. 🙂

👉 Related: Best WordPress Themes: Handpicked and Ranked (Updated)

Step 2: Enter the Google API key

The steps here might differ depending on what theme or builder you want to use.

If you’re using the Divi Builder, you need to enter the Google API key in the API settings of the Divi Builder options.

Like this:

You might want to try to go into your theme or builder settings and see if there’s an option there to add the API key.

Step 3: Add the map to the post or page

If your theme uses a page builder like the Divi Builder, you can add a Google map to your pages by selecting the map module.

Place the module where you want the map to appear, and configure it by entering multiple locations, adjusting the size, and adding markers.

Here’s an example of what it looks like:

Many themes allow you to further customize the map’s appearance directly from the module settings like adding custom markers.

⚠️ Note: Before making the map live, preview the page to make sure that the map displays correctly and that all settings are configured as desired.

Adding Google Maps

Using Google Maps on your WordPress website not only improves navigation but also improves user engagement with interactive and visually appealing maps.

Each of the methods offers distinct advantages — ease of use, the simplicity of direct embedding, or seamless integration.

Choosing the method that best fits your technical skills or the assets that you already have (like if you’re already using a page builder that supports it).