Embedding Interactive Maps with WordPress

by Janice Kenyon 14. January 2013 09:00

Many customers ask if they can include their interactive maps on a WordPress page. So long as you are using the WordPress.org software the answer is yes! This is the version of WordPress that you download and host yourself.

When you publish your interactive map in MapsAlive you can copy the HTML code you need to embed your map in your WordPress page and paste it into the editor on the Edit Post screen in WordPress.

In MapsAlive:

  1. Click the "Show Code Snippets" link on the Tour Preview screen.
  2. Copy the HTML code. You can use either the iframe method or the direct embedding method (see numbers 4 and 5 in the Code Snippets list). In this example we are using the code for the direct embedding method in number 5.

In WordPress:

  1. Go to the Edit Post screen.
  2. Click the HTML tab to switch to HTML view.

  3. Paste the code snippets that you copied from MapsAlive into the editor.
  4. Click Preview to see the interactive map.
  5. When you are done with your post click Publish. You can include text and images in the same post as your interactive map.

Be aware that if you are using the direct embedding method you can only embed one interactive map with this method on the same page. If you are using an iframe, you can embed as many interactive maps as you want on the same page. Or, you can embed one map using the direct method and the rest using an iframe.

Note: if your blog is hosted on WordPress.com you will not be able to include your interactive maps. This is because WordPress.com has limitations that automatically removes the HTML and script tags that you need to embed the map.

WordPress is web software you can download and use to create your own website or blog. The software is used by over 60 million people so being able to include your interactive maps is great news!

Add comment

  • Comment
  • Preview

Connect with us on Facebook Follow MapsAlive on Twitter MapsAlive on LinkedIn