1. Drag a container to the canvas
2. Drag an HTML widget into the container
3. Paste in the embed code on the HTML widget settings
4. Adjust (narrow/widen) the HTML Widget and Container to control alignment of the map on the page
To make the map mobile responsive add this code at the beginning of the HTML widget:
<div class="map-responsive">
And this code at the end:
</div>
Then add Custom CSS on Page Settings:
.map-responsive{
overflow:hidden;
padding-bottom:56.25%;
position:relative;
height:0;
}
.map-responsive iframe{
left:0;
top:0;
height:100%;
width:100%;
position:absolute;
}
Reference: https://www.ostraining.com/blog/coding/responsive-google-maps/
Comments