Need help with Google Map error

Support
#1

I am getting an error message with google map. I have tried everything which was suggested in your support form, but I have not been able to resolve the issue. Please do not advise me to get a Google API as I have done so. Please let me know how to send a private message with my website credential for a support person to check this issue for me. thanks

This is ther error message
maps.googleapis.com/maps/api/js?v=3&:38 Google Maps API error: MissingKeyMapError https://developers.google.com/maps/documentation/javascript/error-messages#missing-key-map-error
_.Pb @ maps.googleapis.com/maps/api/js?v=3&:38
util.js:248 Google Maps API warning: NoApiKeys https://developers.google.com/maps/documentation/javascript/error-messages#no-api-keys

#2

Hi there,

I am afraid I need to say exactly what you asked me not to say, as the error you have mentioned exactly mentions that the API key is not recognized and therefore it will not show the map.

To know how to add a Secure Note read the Secure Note section of the article below:

I also encourage you to take the steps below:

  1. Ensure everything is up to date according to our version compatibility list here. Please follow the best practices when updating your theme and plugins. Click here for more information.
  2. Test for a plugin conflict. You can do this by deactivating all third-party plugins, and see if the problem remains. If it’s fixed, you’ll know a plugin caused the problem, and you can narrow down which one by reactivating them one at a time.

Thank you.

#3

Hello There,

I have checked the site and there is a new Google Map error now:

js?v=3&key=AIzaSyCUj2Is31rud2zzLTZpJ1YY9q9K7FAPbKM&ver=4.9.4:38 Google Maps API error: RefererNotAllowedMapError https://developers.google.com/maps/documentation/javascript/error-messages#referer-not-allowed-map-error
Your site URL to be authorized: http://example.com/

To resolve this error, please check this out:


And to properly create a Google Map API key, please check this out:

#5

@RueNel
Thanks for checking. did you make any changes? I still see the same error.

#6

@ christopher.amirian
your instruction was a repeat and no help!

#7

Hi there,

I added a test page on your website and added my Google Map API Key and it worked like a charm. As my colleague mentioned there is something that you do not follow correctly when trying to create your Google Map API Key. The problem is your key which you need to fix.

Please follow steps mentioned in this article to have a correct Google Map API Key:

https://developers.google.com/maps/documentation/android-api/signup

Thank you.

#8

The test page that you have created displays the map, but when I change to edit mode using cornerstone, I still see the same error on your page too. Any idea what could be wrong there?

#9

Hey There,

When editing in Cornerstone, the map may not display as it posses a different url compared to the live view of the page. The API key may not allowed the URL of the Cornerstone preview because in Cornerstone preview, the map is displayed inside an iframe. As long as the map displays in the from, you are good to go.

Hope this helps.

#10

Hi there, I had the same error. Put this in your functions.php file:

/**
 * Add Google Maps API Key.
 *
 * @action wp_enqueue_scripts
 */
function my_add_google_maps_api_key() {
  wp_enqueue_script( 'x-google-map', 'https://maps.googleapis.com/maps/api/js?key=YOUR_KEY_HERE' );
}
add_action( 'wp_enqueue_scripts', 'my_add_google_maps_api_key', 100 );

Replace YOUR_KEY_HERE with your Google API Key.

You better use this code on a child theme, so that it won’t be lost on theme update.

Bye!

#11

Thank you for helping out, @publione.

#12

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.