Just an update to steps I took. I also checked the JavaScript console and based on the output, I found out to do this https://churchthemes.com/2016/07/15/page-didnt-load-google-maps-correctly/#InvalidKeyMapError
It still doesn’t work even by creating a new API key.
Hello,
InvalidKeyMapError means they key you entered is not valid. I checked your page source and the key in use is “Browser key 1”, which is not an actual key.
<script type='text/javascript' src='https://maps.google.com/maps/api/js?language=en®ion=us&key=Browser%20key%201'></script>
The key Google gives you is a longer, random string like what the arrow points to below.
I went to https://developers.google.com/maps/documentation/javascript/get-api-key and click on GET A KEY link to make a new key. I copied and pasted the key in and it’s still not working. I noticed the screen shot you you added isn’t exactly the same. I see “Type” there as one of the columns. When I make a key through https://developers.google.com/maps/documentation/javascript/get-api-key the “Type” column says “Restriction” instead. Where should I be going to make a key if this isn’t correct?
Thank you
The key I’m seeing used now is NJHeartlandStoreLocator which is not a key so you have the same problem. The key will be something random like in the screenshot, not something that you have chosen.
Is there no “Key” column when you view your key in your Google account?
Hi Steve,
Is there an email I can send you with screen shots of my server key and browser key?
I also went to https://wpstorelocator.co/document/create-google-api-keys/#browser-key and tried making a browser key. However, the google API creation screen would just skip the Browser Key section… I’m frustrated why my screen doesn’t show the way https://wpstorelocator.co/document/create-google-api-keys/#browser-key does.
Thanks
@fernandolawl it’s important you follow the “Create browser key” button on this page since it will automatically enable all the required APIs.
The do seem to have changed the way it looks from when I last checked, but after you have clicked on the button just create a new project, on the next screen fill select “HTTP referrers (web sites) ” and fill in your domain followed by /*. So you get http://domain.com/*. On the next screen you get a key, copy that one and set it as the browser key.
I will update the documentation soon, since they seem to have made some other changes as well.
It can take a few minutes before Google has processed your new key, so if it doesn’t work instantly wait a bit before trying to load the store locator again.
I tried it yesterday and checked it again today. I did the instructions just like you said and just like it was mentioned on the URL you provided (which is the same URL I used originally). I assume I need to make a “Browser Key” too but when I go through the set up on google, it doesn’t give me a “Browser key”. I’m at a loss, can you help me? What else should I do? I made the new API Key and it still doesn’t work.
@tijmensmit Is there a way you can help me? I can email you my login info so you can check it out.
