- To add a google map to your about page, add a table, I used a 3x3 table.
- Switch to code view
- In the head of the html (between <html></html>) add this code:
<style>
#map {
width: 500px;
height: 400px;
}
</style>
<td align="center"><div id="map" ></div></td>
- Finally add this code inside <body></body> it can be at the end of it:
<script>
function initMap() {
var mapDiv = document.getElementById('map');
var map = new google.maps.Map(mapDiv, {
center: {lat: 12.893785, lng: 100.902102},
zoom: 8
});
var marker = new google.maps.Marker({
position: {lat: 12.893785, lng: 100.902102},
map: map,
});
}
</script>
<script src="https://maps.googleapis.com/maps/api/js?callback=initMap"
async defer></script>
-Test your page.
- Play around with the coordinates, you can change them to point anywhere, you can get the lat and lng (latitude and longitude) in the actual google maps site.
Here are the files in case you want to use them LINK
No comments:
Post a Comment