Google Maps Not Working?
There are a several reasons why your google maps may not be working, the most common issue being no Google Map API key set or set incorrectly. To use the Google Maps JavaScript API, you must register your app project on the Google Cloud Platform Console and get a Google API key which you can add to your app.
Overview
Invalid or No Google API Key Set
A typical example of what you will see in place of the Google map option does not have a registered API key or the key has been implemented incorrectly:
Use The Chrome Browser DevTools To Diagnose
You will need the Chrome browser for this, download here. Once installed, navigate to the page that displays the Google Map and follow the instructions below:
Open the Google Chrome browser and navigate to the page/Google map that you want to inspect.
- Right-click anywhere on the webpage. Near the bottom of the menu that pops up, you will see ‘Inspect’, click that to open the Chrome DevTools console.
- Click on the ‘Console’ tab to check for any JavaScript errors. See an example below:
Google Maps API Error Explanation
Below is a description of that the API error entails, or click here to read detailed information on https://developers.google.com/
MissingKeyMapError 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.
Setup Your Google Maps API Key
To set up your Google Map API key please do follow their detailed instructions in the ‘Get API Key’ article.
Here are some important articles to read with regard to recent changes implemented by Google for Google Maps usage:
- Product and pricing changes, guide for existing users (effective starting July 16, 2018).
- The API key allows you to monitor your application’s API usage in the Google Cloud Platform Console. See Google Cloud Platform Console help for more information.
- If you are a Standard Plan customer, with an API key you have access to generous free daily quota, as well as the option to increase your daily quota by enabling pay-as-you-go billing.
Users will need to add their billing info to Google Maps, although they won’t be charged unless they are over $200 per month. Google already sent an email to users which use it’s Maps service. That email also includes their assessment for currently used API keys, so it should be clear if user would need to pay for Maps service in future or not. View Google’s email notification.
Check The Address Format
Use a correct address and not google map embed code, or longitude/latitude. It has to be a written address, example below:
775 New York Ave, Brooklyn, Kings, New York 11203
Copyright Text Formatting
The copyright text has to have complete, valid HTML markup. Valid HTML is required for theme to function properly. Please make sure to format the HTML correctly anywhere so that issues like this don’t happen. Click Here For An Example.
Potential 3rd Party Plugin Conflict
Third party plugins may be conflicting with the map feature. Please disable any plugins that were not included with Avada to see it if fixes the issue. If it does, enable the plugins one by one to find the culprit.