Skip to main content

Embedding a Map with WordPress

Get A Map Embed Code

It's easy to embed a map created in the Mappedin Map Editor into any web page. Follow the steps below to copy a embed map code snippet.

  1. Log into the Mappedin Map Editor.

  2. Open the map to embed.

  3. Click on the Preview button. The Copy Embed button

  4. Click on the "Share" button.

  5. If the map is in Draft status, use the drop down to change it to Live.

  6. The Copy Embed button

  7. Click on the "Copy Embed" button.

    The Copy Embed button

    The code to embed the map has now been copied to the clipboard.

Embed the Map Code

Follow the steps below to embed a map as it appears in the Mappedin Viewer into a page on a web site created using Wordpress.

  1. Click the Add Block button.

  2. Click on Browse All.

    Wordpress blocks

  3. Search for Custom HTML.

    Wordpress custom HTML block

  4. Click on Custom HTML.

  5. In the box that says Write HTML paste the Mappedin embed code.

    Wordpress HTML block with mappedin embed code

  6. Click on the Preview tab to preview the embedded map.

    Wordpress HTML block with Mappedin map in preview mode

  7. If the map looks correct press Publish to publish the updates to the page.

The map should now appear on the web page similar to the screen shot below.

Wordpress Map Embedded