The code below is working in sample HTML page, but not when I load it in Cookillian plugin… I’ve added div #map_canvas to theme’s css, added same div id tag to my contact page and added both scripts in header area (in Cookillian dashboard).
So why doesn’t google map load on my website, but it loads on simply html page on my computer?!?
<!DOCTYPE html>
<html>
<head>
<title>Simple Map</title>
<meta name="viewport" content="initial-scale=1.0, user-scalable=no">
<meta charset="utf-8">
<style>
html, body, #map_canvas { margin: 0; padding: 0; height: 350px; width: 100%; }
</style>
<script src="https://maps.googleapis.com/maps/api/js?key=MY_KEY&sensor=false"></script>
<script>
var map;
function initialize() {
var mapOptions = {
zoom: 8,
center: new google.maps.LatLng(-34.397, 150.644),
mapTypeId: google.maps.MapTypeId.ROADMAP
};
map = new google.maps.Map(document.getElementById('map_canvas'),
mapOptions);
}
google.maps.event.addDomListener(window, 'load', initialize);
</script>
</head>
<body>
<div id="map_canvas"></div>
</body>
