30% Discount Get your Kallyas WordPress license Today for only $49! Or renew your support at $18 for extra 6 months. Shop Now

How to setup Google map

Each page wich contain a google map should have a script at the end of the page which show off the google map API key.

The script should look something like this:

 <script async defer src="https://maps.googleapis.com/maps/api/js?key=YOUR_API_KEY&callback=initMap" type="text/javascript"></script>

In order to get an API key please visit: https://developers.google.com/maps/documentation/javascript/get-api-key

Also the google map can be customized from the google map init function which can be found in the bottom of the page.

google.maps.event.addDomListener(window, 'load', init);
  function init() {
 // Basic options for a simple Google Map 
// For more options see: https://developers.google.com/maps/documentation/javascript/reference#MapOptions
  var mapOptions = {
  //your options
  };
// Get the HTML DOM element that will contain your map 
 // We are using a div with id="map" seen below in the <body> 
  var mapElement = document.getElementById('map');
// Create the Google Map using our element and options defined above
// Create the Google Map using our element and options defined above 
  var map = new google.maps.Map(mapElement, mapOptions);
 // Let's also add a marker while we're at it
  var marker = new google.maps.Marker({ 
    position: new google.maps.LatLng(40.6700, -73.9400),
    map: map,
    title: 'Snazzy!'
  });
}