Having an issue with Google Maps on my WordPress website. The error message displayed is: Google Maps API error: MissingKeyMapError
I have obtained a Google Maps API key, but I am unsure where to insert it. I am not using a Google Maps plugin; instead, my theme has a built-in Google Map feature. Upon investigating, I found a reference to a Google Map JavaScript file containing the following code:
var tl_geocoder;
var $tl_map;
var $tl_marker=false;
jQuery(function(a){
jQuery(document).ready(function(c){
tl_geocoder=new google.maps.Geocoder();
c(document).on("click",".layers-check-address",function(f){
f.preventDefault();
$tl_map=c(this).closest(".layers-map");
var g=c(this).closest(".layers-content").find('input[id$="google_maps_location"]').val();
var d=c(this).closest(".layers-content").find('input[id$="google_maps_long_lat"]').val();
$tl_map.data("location",g.toString());
$tl_map.data("longlat",d.toString());
b(c);
});
b(c);
});
function b(d) {
var c=false;
jQuery(".layers-map").each(function(){
var h=d(this);
var k=(undefined!==h.data("longlat"))?h.data("longlat"):null;
if(null!==k){
var l=k.split(",");
var m=l[0];
var e=l[1];
} else {
var m="-34.397";
var e="150.644";
}
var f=new google.maps.LatLng(m,e);
var j=h.data("zoom-level");
$tl_map=new google.maps.Map(h[0],{
scrollwheel:false,
zoom:j,
center:f,
mapTypeId:google.maps.MapTypeId.ROADMAP
});
var g=!d(this).closest("div.layers-contact-widget").hasClass("no-infobox");
if(undefined!==h.data("longlat")){
var n=new google.maps.LatLng(m,e);
$tl_map.setCenter(f);
$tl_marker=new google.maps.Marker({
map:$tl_map,
position:n,
zIndex:google.maps.Marker.MAX_ZINDEX+1,
icon:TL_CONF.themeurl+"/assets/images/google-marker.png"
});
if(!c && g){
c=true;
d("body").trigger("setInfobox")
} else {
$tl_marker.setMap($tl_map)
}
}
if(undefined!==h.data("location") && $tl_marker===false){
var i=h.data("location");
tl_geocoder.geocode({address:i}, function(p,o){
if(o==google.maps.GeocoderStatus.OK){
$tl_map.setCenter((p[0].geometry.location?p[0].geometry.location:f));
$tl_marker=new google.maps.Marker({
map:$tl_map,
zIndex:google.maps.Marker.MAX_ZINDEX+1,
position:(p[0].geometry.location?p[0].geometry.location:f),
icon:TL_CONF.themeurl+"/assets/images/google-marker.png"
});
if(!c && g){
c=true;
d("body").trigger("setInfobox")
} else {
$tl_marker.setMap($tl_map)
}
}
})
}
})
}
}(jQuery));
Despite this code snippet, I am still uncertain about where exactly to insert the Google Maps API key.