Mapbox Embed Static Map at Website

Aug 7, 2020

Generate URL at: https://docs.mapbox.com/playground/static/

Attribution is required: https://docs.mapbox.com/help/how-mapbox-works/attribution/#static--print

Html and CSS

.map-container {  position: relative;}.map-attribution {  position: absolute;  bottom: 0;  right: 0;  background-color: rgba(255,255,255,.5);}.map-attribution a {  color: rgba(0,0,0,.75);}
<div class="map-container">  <img src="GENERATED_STATIC_MAP_URL">  <div class="mapbox-attribution">    © <a href='https://www.mapbox.com/about/maps/'>Mapbox</a> © <a href='http://www.openstreetmap.org/copyright'>OpenStreetMap</a> <strong><a href='https://www.mapbox.com/map-feedback/' target='_blank'>Improve this map</a></strong>  </div></div>

MapBox Static Map with Attribution

❤️ Is this article helpful?

Buy me a coffee ☕ or support my work via PayPal to keep this space 🖖 and ad-free.

Do send some 💖 to @d_luaz or share this article.

✨ By Desmond Lua

A dream boy who enjoys making apps, travelling and making youtube videos. Follow me on @d_luaz

👶 Apps I built

Travelopy - discover travel places in Malaysia, Singapore, Taiwan, Japan.

Tags