-
AuthorPosts
-
January 17, 2017 at 7:27 pm #734937
Hello-i am receiving an error when using the google maps.
Oops! Something went wrong.
This page didn’t load Google Maps correctly. See the JavaScript console for technical details.Please advise.
ThxJanuary 17, 2017 at 9:25 pm #734984Google requires that you set up API credentials now before you can integrate with their mapping API. Enfold has a Google Services tab in Theme Options where you can place your credentials once you’ve created them through Google. There are instructions here:
https://developers.google.com/maps/documentation/javascript/get-api-key#key
January 17, 2017 at 9:43 pm #734993Hello, I created the API Key and entered it in the google services in the enfold theme. Still receiving the error.
January 17, 2017 at 9:56 pm #734996To get it to work on my sites, I have to set the Key Restriction to “HTTP Referrers (websites)” and add the following to the “Accept requests from these HTTP referrers”
somedomain.com/*
*.somedomain.com/*Also, the page where you create the credentials says “Note: It may take up to 5 minutes for settings to take effect”.
Also also, you might make sure you’ve saved the settings correctly. For some reason, you can click save after entering each of the HTTP referrers but then you have to save it one last time to actually commit your changes.
January 18, 2017 at 12:46 am #735043Hi-yes, tried all those things that you state and still same result. Is there something that I need to update code for this to work? I have tried with and without restrictions.
January 18, 2017 at 12:58 am #735046It looks like that even though I am putting the Key in the Google services and saving it, it is not actually saving it. Error is:
MissingKeyMapError Error
The script element that loads the API is missing the required authentication parameter. If you are using the standard Maps JavaScript API, you must use a key parameter with a valid API key. If you are a Premium Plan customer, you must use either a client parameter with your client ID or a key parameter with a valid API key.See the guide to API keys and client IDs.
js:34 Google Maps API error: MissingKeyMapError https://developers.google.com/maps/documentation/javascript/error-messages#missing-key-map-error
January 18, 2017 at 1:02 am #735052Hmmm. I’m not sure what to tell you without looking at your Google account and the site itself. Are you 100% sure you’re putting the key in the Google Maps API Key field? Does the key show in that field when you go back to the theme options? When you save your Theme Options, are you definitely getting the “Alright Sparky. All Options saved, no problems whatsoever.” message?
January 18, 2017 at 1:07 am #735054I am, really strange. I have another site and it works fine with the Enfold them. I can see the map initially loading and then it errors. Is there a line of code that I can check to make sure the reference is there? Basically, where does the API key get set?
January 18, 2017 at 1:12 am #735055You should be able to right click on the page and choose View Source (or something similar) and find some code that looks like this except it would have your API key in it:
<script type='text/javascript'> /* <![CDATA[ */ var avia_framework_globals = avia_framework_globals || {}; avia_framework_globals.gmap_api = 'BlXTeACnIsVgIzaSysy4V5CWty3r8kqDrXCmIF5'; /* ]]> */ </script>
Maybe search the source code for “avia_framework_globals” and see what you find. If I had to suspect I would say this is still related to the key being valid (or not). Just a guess though.
January 18, 2017 at 1:23 am #735059yep-the key that is in the code is the one that i have registered, so the theme is updating the code correctly. I have no restrictions on the key so I am at a loss now about what to do.
January 18, 2017 at 1:34 am #735060so i tried another api key that has no restrictions on the key and it is currently working on another site in Prod. it does not work on this site, so it is something within the site that is causing the issue. any further ideas are greatly appreciated.
January 18, 2017 at 1:40 am #735061Just a few ideas on what to try: Have you tried disabling all plugins? Switching to the main Enfold theme if you’re using a child theme? Deleting the map builder block and recreating it? If you’re using Chrome, you could also open the Developer Tools (CTRL + Shift + I) and check out the Console tab to see if there are any JavaScript errors being thrown. If there are, it could be preventing other scripts on the page from running correctly.
January 18, 2017 at 1:51 am #735069so i added the wp google maps plugin and added the same google api key that the Enfold theme uses, and the wp google maps plugin loaded the maps without error, so there is something within the Enfold theme that is causing the problem. if there was a plugin causing the issue then i believe that the wp google maps would not work either. i will try to disable the enfold theme and reactivate it and try updating the google map within the page builder.
January 18, 2017 at 1:54 am #735070Can you post a link to the site? You’d have to do it publicly since I’m not a moderator.
I would still try disabling all the plugins. You never know what’s interacting in a way you didn’t expect. That said, have you tried a Shift + Refresh to force the page to reload all of the assets from the server?
January 18, 2017 at 2:04 am #735074good call on disabling the plugins. I disabled them all and the maps started loading correctly. Weird thing is, I enabled the one by one and after enabling them all, the maps continue to load. Not sure what happened but it is working as expected now.
Thanks for your help troubleshooting this problem!
January 18, 2017 at 2:08 am #735075Great to hear. Happy to help!
January 18, 2017 at 7:02 am #735147Hi,
Thanks a lot for helping out @kevinmcgillivray :-)
Let us know if you should need any further help on the topic @bwilbourne
Best regards,
Rikard -
AuthorPosts
- You must be logged in to reply to this topic.