Missing API key for Google Maps

Maps don't show up for events. Add-ons are enabled, Google Maps plugin is configured. Here's an example event page: https://christiangays.com/events-listing/2017/07/national-womens-music-festival/

Google Developers Console has been checked, all the APIs seem to be enabled, new key had been created, that doesn't help.

Whatever key is used, it always says in a console that the key is missing.

Support access granted.

  • Dimitris
    • Support Star

    Hey there Mary,

    hope you're doing good today! :slight_smile:

    I just had some feedback from our devs and it seems that something - which is not us (i.e. a plugin or a theme) - adds a non-keyed Google maps request.
    On the linked page, you can see this by checking the source around line 1055 for something like <script type='text/javascript' src='//maps.googleapis.com/maps/api/js'></script>

    The best way to pinpoint the source of this script is a conflict test, as described here:
    https://premium.wpmudev.org/wp-content/uploads/2015/09/Support-Process-Support-Process.gif

    Hope that was some help, let me know if further assistance is required here!
    Warm regards,
    Dimitris

  • Mary
    • Wisp of the WP Loop

    I have done a plugin and theme conflict test but no change.

    I have removed all extra API's that I had in my console, and created a new Google Maps JavaScript API, and entered the new code in the Google Maps settings.

    I don't know where to go from here.

  • Mary
    • Wisp of the WP Loop

    I contacted the theme developer. He says:

    It could be that the map is trying to load without HTTPS:

    It could also be an API key issue. (but I don't think so because I have reissued a new API and still have the same problem.)

    I would assume there's something going on with the plugin you're using/the Google Maps API key.

    Could I get more help with this please.

  • Dimitris
    • Support Star

    Hey there Mary,

    hope you're doing good and please excuse our late reply here. It seems that your continuous replies, also lower down this thread in our cue.
    Ref: https://premium.wpmudev.org/docs/getting-started/getting-support/#chapter-4

    I have done a plugin and theme conflict test but no change.

    As this is the only way that we could find out where this script is being added, we could try to proceed with this conflict test ourselves, I just asked you to do so as this is a live website.
    Concept here is to activate WPMUDEV Dashboard, Events+ and Google Maps plugins and check how that goes (prior to that you should clear/purge and deactivate all involving caches).
    If this resolves the issue, activate back the remaining plugins and theme one-by-one, checking each time until you get again the aforementioned issue, and thus, the conflicted combination.

    Is that's too much for you and you wish us to proceed with that, please send us over some server credentials. As this is public forum, you should send us your details through our safe contact form https://premium.wpmudev.org/contact/#i-have-a-different-question using this template:

    Subject: "Attn: Dimitris"
    - WordPress admin (login url/username/password)
    - FTP credentials (host/username/password)
    - cPanel/Plesk credentials (host/username/password)
    - link back to this thread for reference
    - any other relevant urls

    Keep in mind the subject line as ensures that it gets assigned to me.

    Warm regards,
    Dimitris

  • Mary
    • Wisp of the WP Loop

    Thank you Dimitris. Doing the plugin conflict test took me ages and I have no desire to do it again.

    I have sent the credentials to you in the hopes that you can do it without interrupting the site for too long.

    I will put a notice on the front that you will be working on it and some interruptions may occur.

  • Predrag Dubajic
    • Support

    Hi Mary,

    I had a look at your installation and one of the issues is related to Uber Menu 3 which uses GMaps API as well, I did disable "Load Google Maps API" option from Uber Menu 3 General Settings and this worked on my test installation but for your site there's still something causing issues with maps.

    I'm afraid that full conflict test is needed here as you have almost 100 plugins and it will take too much time from us to go through them and test this for you.

    Since you have large number of plugins and custom functionalities from mu-plugins I would strongly suggest setting up a staging site where you can perform these kinds of tests without affecting your live site.

    Best regards,
    Predrag

  • Lindeni Mahlalela
    • Recruit

    Hello Mary.

    I hope you are doing great today and thank you for your patience as we resolve this issue.

    In addition to what my colleague Predrag has mentioned above, there are two issues that I found with regards to this issue.

    1. There was a small bug on the plugin itself that prevented some scripts in the plugin to load over HTTPS, these scripts were blocked by the Browser which identified them as insecure content. There were also some minor warning from the Google API service saying some variables are deprecated or no longer supported. I have fixed this insecure content and warnings, I have this fix already applied to your website.

    After applying this fix, I get the error:

    InvalidKeyMapError
    Which means the API key being used is either invalid or is not properly setup. This is the second issue in your setup, details below.

    2. The API Key: Steps missing in the setup of the API Key.

    I have verified this by replacing your API key with one I created in the Google API Console, here are the results of the two different API keys.

    The current API Key shows:

    New API Key Shows:

    I suggest you follow this document to setup your API Key. Once you have created your API key, you should load the "API Manager" page in the Google API Console.

    Here is what you should do step by step:
    Enable Google Maps API:

    and verify its enabled in the next page

    On this page, you should see a graph of the API calls if the Google Maps API has been enabled. After finishing this step, go to the page that should display the map, refresh it couple of times and return to the Google Maps API page in the console, you should see the API number of calls graphed in the chart. If there are no numbers and you have visited the page that should display a map a couple of times then double check the settings and whether the Google Maps API is enabled or not.

    Would you please address the API Key issue in the Google API Console and test, after that please let us know if that solves the problem or not.

    I hope you enjoy your day further.

    Cheers,
    Mahlamusa

  • Lindeni Mahlalela
    • Recruit

    Hello Mary,

    I am sorry I have missed something, I noticed that I have left my API key in your website, it is now working with my API key so you have to follow the steps outlined above to setup your API key then replace my API key with yours. You do that in the "Settings > Google Maps" page on your dashboard.

    I am sorry I forgot the confusion and inconvenience caused.

    Cheers,
    Mahlamusa

Thank NAME, for their help.

Let NAME know exactly why they deserved these points.

Gift a custom amount of points.