Divi – Adding Custom Google Map Code

The video can help you quickly do it.  If you want to read and do please do as follows.

Embedding a Google Map into a text module of the Divi theme in WordPress is a straightforward process. Follow these steps to do it:

1. Log In to Your WordPress Dashboard: Open your WordPress website’s dashboard by visiting yoursite.com/wp-admin and logging in with your credentials.
2. Access the Divi Builder: Once logged in, navigate to the page or post where you want to embed the Google Map. Click the “Enable Divi Builder” button at the top of the editor.
3. Add or Edit a Text Module: Inside the Divi Builder, locate the section where you want to place the Google Map or add a new section. Then, add a Text Module by clicking the “+” button.
4. Switch to Code Editor Mode: Inside the Text Module, you will see a “Visual” tab and a “Text” tab. Click on the “Text” tab to switch to the code editor.
5. Get the Google Maps Embed Code: Open a new browser tab and go to Google Maps. Search for the location you want to embed and click on it to open the map. Then, click on the hamburger menu (three horizontal lines) in the top-left corner and select “Share or embed map.”
6. Configure Map Settings: In the “Share or embed map” window, you can configure the map size, the location to start with, and other settings. Adjust these according to your preferences.
7. Copy the Embed Code: Click on the “Embed a map” tab to reveal the HTML code. Copy the entire code snippet.
8. Paste the Embed Code in the Text Module: Go back to your WordPress dashboard and paste the Google Maps embed code into the Text Module’s code editor. You should see the HTML code within the module.
9. Save or Update the Page/Post: After pasting the code, make sure to save or update your page or post to apply the changes.
10. Preview or Publish: To see how the Google Map looks on your website, click the “Preview” button or publish the page or post if you’re ready to make it live.
11. Check the Map on Your Website: Visit the page where you embedded the Google Map to ensure it’s displayed correctly.

That’s it! You’ve successfully embedded a Google Map into a text module of the Divi theme in WordPress. Users visiting your site will be able to interact with the map as they would on the Google Maps website.