- This topic has 4 replies, 3 voices, and was last updated 6 years, 1 month ago by FREDERIC.
-
AuthorPosts
-
July 5, 2016 at 2:47 pm #94827gdyeacuParticipant
Hi,
I am trying to embed a google maps location into my website. I realise that I need an API key but am not sure where in my code it needs to go
Can you tell me where I should paste it please?
<script src=’https://maps.googleapis.com/maps/api/js?v=3.exp’></script><div style=’overflow:hidden;height:440px;width:700px;’><div id=’gmap_canvas’ style=’height:440px;width:700px;’></div><div><small> embed google maps </small></div><div><small>disclaimer generator</small></div><style>#gmap_canvas img{max-width:none!important;background:none!important}</style></div><script type=’text/javascript’>function init_map(){var myOptions = {zoom:11,center:new google.maps.LatLng(52.7224021,-1.3740620999999464),mapTypeId: google.maps.MapTypeId.ROADMAP};map = new google.maps.Map(document.getElementById(‘gmap_canvas’), myOptions);marker = new google.maps.Marker({map: map,position: new google.maps.LatLng(52.7224021,-1.3740620999999464)});infowindow = new google.maps.InfoWindow({content:’Coalville Acupuncture<br>Belvoir House, Belvoir Road, LE67 3PN<br>’});google.maps.event.addListener(marker, ‘click’, function(){infowindow.open(map,marker);});infowindow.open(map,marker);}google.maps.event.addDomListener(window, ‘load’, init_map);</script>
July 5, 2016 at 4:55 pm #94836MaheshKeymaster@gdyeacu: Seems like there is some error while generating code. I generated the code again and got it working.
<script src='https://maps.googleapis.com/maps/api/js?v=3.exp'></script><div style='overflow:hidden;height:440px;width:700px;'><div id='gmap_canvas' style='height:440px;width:700px;'></div><div><small><a href="http://embedgooglemaps.com"> embed google maps </a></small></div><div><small><a href="https://termsandcondiitionssample.com">terms and conditions generator</a></small></div><style>#gmap_canvas img{max-width:none!important;background:none!important}</style></div><script type='text/javascript'>function init_map(){var myOptions = {zoom:10,center:new google.maps.LatLng(51.58250734077006,-0.0027888175781098923),mapTypeId: google.maps.MapTypeId.ROADMAP};map = new google.maps.Map(document.getElementById('gmap_canvas'), myOptions);marker = new google.maps.Marker({map: map,position: new google.maps.LatLng(51.58250734077006,-0.0027888175781098923)});infowindow = new google.maps.InfoWindow({content:'<strong>Title</strong><br>Belvoir House, Belvoir Road, LE67 3PN<br>'});google.maps.event.addListener(marker, 'click', function(){infowindow.open(map,marker);});infowindow.open(map,marker);}google.maps.event.addDomListener(window, 'load', init_map);</script>
Where to put the code depends on where you want it. For example if you want the map on the sidebar, you can use text widget, paste all the code above in it.Let me know if any problem.
Regards,
MaheshJuly 6, 2016 at 2:14 am #94867gdyeacuParticipantWhen I paste your code into my page, and then refresh and view the page, there is still the same error message. Should I use my API key? Or have you already included one?
AIzaSyDeFMA2mCDBIiFIDkitLeOnmL4MitVnhwM
July 6, 2016 at 10:04 am #94885MaheshKeymaster@gdyeacu: Are you using any plugins for this or simply generated code? I used http://embedgooglemaps.com/en/ to generate the code for the map. And is running fine, no API key required. Please check the image in the link below, this is how it is being displayed on mine, using the above code.
Let me know if any problem.
http://goo.gl/6zOGvhRegards,
MaheshMarch 28, 2018 at 9:11 am #134261FREDERICParticipantHi Mahesh
I profit of this old post.
Where do you put this code ?
Is it possible in the custom CSS or it’s inside the page ?
For me it’s a widget for remplace the picture in the right of my websitefredericvoyage.fr
(website under construction)
Thank you so much
Frederic -
AuthorPosts
- The topic ‘Google Maps API Key’ is closed to new replies.