How To Add Google Map In Divi Theme? (With and Without API key)

add-google-map-in-divi

As you are here, I understand that you are looking for the best and easiest way to add Google Map in Divi theme website. Am I correct?

Google Maps can be included in the Divi theme using two methods – With and without an API key. I’ll explain both the methods in detail.

Let’s get into the details! 

How To Insert A Map Into Divi? (Using API key)

Step 1: Go to the WordPress Dashboard section. If Divi theme is already installed, you can directly navigate to Divi. Other Buy through Divi Discount and save your money.

If not, download it before proceeding with this method. Then click Theme Options section. If scroll down, you can find the section Google API Key.       

divi-theme-options

A Question mark symbol would have been provided beside the API key. Click on that Question Mark. The popup will give an insight into how the Google API key can be obtained. Click on the link provided.

google-api-key

The link will redirect you to the Elegant Themes official documentation area. Here, another link, that is, Google Developers Console Link, is provided. Click on that.

google-maps-api-key

It will be redirected to Google Cloud Platform area. You must follow three steps to get a new API key there. 

Under Confirm Project, give Next. Go to Enable APIs, give Enable. Then get the API key. 

get-api-key

Once you get the key, go back to Divi Theme Options and paste the respective code in Google API Key section. Click the Save button.

divi-google-api-key

The next step is adding the Google Map. You can embed Google Map in any existing page or a new page. This method has been further proceeded by creating a new page for your convenience.

Click Add New page. Give a suitable title, then click Use Divi Builder button.

create-new-page-divi

Now, three options will be displayed. From that, choose Build From Scratch. After that, choose single column. Then search for the Map module and add it.

divi-map-module

Now go to Map Settings. Under Map Center Address, the correct address should be given in that field. That’s all.

map-module-settings

Note: This method isn’t working for me as well as for many people worldwide. Yes, I have heard several complaints like “Divi Google maps not working,”

Divi Map not showing,” etc. 

So I use the alternate method, adding Google Map without API Key. You may continue with this method if it works for you. 

How To Add Google Maps to Divi site? (Without API key)

This method is very easy to implement! If your Divi theme Map Module not working, you may follow this simple way!

Step 1: Go to Google Maps and enter your desired location. Click Share, then click Embed A Map.

google-embed-map

Step 2: A link will be available. Give Copy HTML.

copy-code-divi-settings

Step 3: Go to an existing page or new page on your website. Select Build From Scratch. Here, instead of the Map module, search for Code module and insert it.

divi-module-code

Step 4: Paste the copied code in that module. After pasting the code, find ‘Width’ and give it as 100%. Save all the changes and visit your website. The map would have been added successfully.

No API Key is required for this method.

google-map-divi-code-settings

So, you have successfully inserted the Google map in your website built with the best WordPress theme builder, Divi. 

Video Tutorial To Embed Google Map in Divi

If the above step-by-step tutorial to use Google Maps in Divi theme, here is a clear video explanation for executing it! 

Alternate Way To Add Google Map In Divi Site

If you are not comfortable with any of the above-discussed ways, you may use the active WordPress plugin like WP Go Maps or MapPress to get the job done in just a minute! 

Advantages Of Adding Google Map To Business Site

So far, you have learned the easy ways of creating the Google maps on your Divi website, and here come its benefits to support your choice of adding your location to your web asset.

  • Supports local SEO which helps to get massive traffic from search engines.
  • Ideal way to share your location with the targeted audience. 
  • Improves your credibility, and hence your customers gain trust in your business 

Wrapping Up

If your business has a physical location, you should add its address to your website as it will help your customers reach you easily. It also enhances your trustworthiness. 

I hope you got the answer to the question – How do I create a map in Divi theme? I would say that you have made the right decision to add your location to your business site through Google Maps. 

Wishing you get massive customers to your product/service. You may contact us through the comment section if you experience any problems when you add Google Map in Divi builder. 

Other Divi Theme Tutorials

Remove Sidebar In Divi Theme

Change Divi Theme Logo

Edit Footer In Divi Theme

Add YouTube Background In Divi

by Sakthi
Sakthi is a thoughtful guy who specializes in WordPress Setup & Design. He is interested in designing the functional & attractive WordPress themes for the Digital marketers & Bloggers and helping them attain their goals with a tailored site. Being an Elite author of ThemeForest.net, he is interested in sharing his knowledge through the helpful tutorials.

Leave a Comment