How to embed a Google Map on your page

Showing your visitors where you’re located can improve your conversion rate, and one of the most popular options for maps is the one built by Google. Here’s how to add Google Maps to your pages in a few simple steps.

     1. Go to maps.google.com and search for or navigate to the desired location;

image from maps.google.com

     2. Click on Share;

image of the share button on maps.google.com

     3. Choose Embed map;

image of the embed map option

     4. Choose the size you need from the menu in the top left corner, and then copy the code;

image of the map embed code

     5. Go to your Instapage landing page, and create a new HTML element;

image of the builder sidebar

     6. Paste the code in the newly created HTML element.

image of the google maps embeddable code pasted inside an HTML element

And that’s it. Now your visitors will be able to see maps with your location. They will be able to get redirected to a page with directions from within the map widget, save the location to their Google Maps account, zoom in or out, see the widget as a satellite image or as a map, and more.

To be able to resize and arrange the map on mobile, you can set the values of height and width to 100% and toggle Full size content ON. 

Note: The HTML element may mostly show in preview mode as well, but for security reasons, it is very possible that the code will not render correctly in the preview, since it is generated differently from the live environment. Please make sure to test your code on the live page before making any conclusions regarding it.