How to Add/ Embed Google Map to Your Website

Last updated on Nov 18, 2016 Jean Hyler Tips

A map or a direction is very useful and convenient for your customers or visitors to know where your office is located, type in the address they will be going to and automatically get directions to the event location. Among so many mapping apps and services out there, the definitive king of maps is Google Maps. Google Maps offers powerful and user-friendly mapping technology and local business information, including business locations, contact information and driving directions.

To embed a map or directions in a website or blog, please follow the steps below:

1. Open Google Maps.
2. In the top left corner, type in any street address or geographic location and then click Search.

3. Click Share and a popup will appear.

4. At the top of the popup that appears, choose Embed tab. Choose the size you want, then copy the HTML embed code from the box. The code begins with <iframe.

5. Go to the post or page you want the map to appear, paste the code into directly into your post or page.
6. Click Update or Publish. You can see the map if you refresh the post or page.

Here is an example of the embedded map will look like:

To change the contact information on our Contact Us or Map section, please follow the steps below:

1. Go to AppearanceTheme OptionsHome Page>Contact Us or Map section
2. Get the map embed code from the steps above and then paste it into a text file.
3. Copy and paste the highlighted part into Google Map box