How Do I Add a Google Maps Element to My Website Using WPBakery Page Builder?

How Do I Add a Google Maps Element to My Website Using WPBakery Page Builder?

How Do I Add a Google Maps Element to My Website Using WPBakery Page Builder?

Who Is This Article For?

  • All users with access to pages, blogs, contests, or sidebars
  • Applicable to all themes

Important Note

  • The Google Maps widget is not recommended for use in the sidebar, as it can potentially exceed the 1 million hits allowed by Google under its free plan.

WPBakery Page Builder (formerly Visual Composer) allows you to easily insert a Google Map onto your site using an embed code. Follow the steps below to add a Google Map to your website:

Step-by-Step Guide

  1. Go to Google Maps.
  2. Use the search field in the upper left to find your desired location.
  3. Adjust the map zoom level to your preference.
  4. Once your location and zoom are set, click the "cog" icon in the bottom right corner of the map to open the menu.
  5. Select the "Share or embed map" option. A popup window will appear.
  6. Go to the "Embed map" tab in the popup window.
  7. Copy the entire embed code provided.
  8. Return to your website and open the WPBakery Page Builder.
  9. Add the Google Maps widget to your page.
  10. In the widget popup window, locate the "Map embed iframe" field.
  11. Paste the embed code you copied from Google Maps into this field.
  12. Adjust any additional settings as needed, then save your changes.

Google Maps Embed Example

Following these steps will allow you to display a Google Map on your website using WPBakery Page Builder. If you have any questions or need further assistance, please contact our support team.