Embedding

If you've found yourself on this page, we're assuming you've

Signed up for a MapBox account and logged in.
Created or uploaded a map to MapBox.

You can embed your map on another web page, blog post or press release by copying and pasting its embed code.

Are you a developer?

Developers can use HTML and JavaScript for advanced web integration using the MapBox API.

Copying your map’s embed code

Find the map on your account page and click its thumbnail to view it.
Click the Embed button at the bottom right. You’ll see a popup with two boxes – one for embedding the map and one for integrating the map in code.
Click the text under Embed code and copy the text using Ctrl+C or Command+C.

Embed on an HTML page

To add your map to a normal HTML page just paste the embed code into the contents of the page. You can adjust its dimensions by altering the width and height attributes of the embed iframe.

...
<p>
World Bright has a lot in common with our other
world map tilesets, but includes some additional
data layers and unique styling. The biggest new
feature is a custom labels layer of water bodies.
</p>

<iframe width='500' height='300' frameBorder='0' src='http://a.tiles.mapbox.com/v3/mapbox.world-bright.html#7/65/-18.700'></iframe>
...

Embed on WordPress

To embed your map in WordPress you may want to install the MapBox WordPress plugin. The plugin converts MapBox embed codes into a WordPress shortcode, making it easy to edit embeds once they’ve been added to your site.

Embed on Drupal

Drupal sites usually implement content filters that restrict the HTML tags that are allowed on pages. When embedding a MapBox map on a Drupal site look for an input format called Full HTML or Extended HTML that allows iframe tags to be used. If you have trouble pasting your embed into a Drupal site, ask a site administrator to set up an input format that allows iframe tags.

Examples of embeds

Poisoned Places: Air Pollution In Your Town (NPR News)
Connect America Fund: Putting Consumers on the Map (The FCC)
Durban: World Bank Publishes High Resolution Climate Predictions (Development Seed)
A New Running Map (Tom MacWright)
Rooftop Solar Challenge to Cut Solar’s Red Tape (Department of Energy)

Mission complete! Next up:

Statistics on who is viewing your map and how.
Advanced API embedding for doing more with your maps.
Embeds vs. API for guidance on which method to use.

Hosting