[Tutorial] Widgetkit Maps, YOOtheme Pro Map element and the Googlemaps API key
Google provides the Googlemaps service for free, but — probably due to a change of the policy — this service may require a valid key for the site displaying and using the maps.
If there is no such key, the maps might not be displayed. Instead you will see an error message.
Did you create and publish a Widgetkit Map and then don't see a map but a warning like the following?
Oops! Something went wrong.
If there is a
If you don't have a Googlemaps API yet, go to https://console.developers.google.com/apis and create one.
If you don't have such an account yet and feel unsure about how to create it, please ask your site's webmaster for assistance.
Once you have obtained a Googlemaps API key, insert it into the Widgetkit settings field "Google Maps API key".
Widgetkit 2.5.7 or higher:
In the Joomla backend go to Components > Widgetkit and click on "Options" at the top right.
In the WordPress backend go to Settings > Widgetkit.
Widgetkit 1.5.9 or higher:
In the Joomla backend go to Components > Widgetkit and click on the tab "Settings":
In the WordPress click on Widgetkit in the dashboard and then on the tab "Settings":
Important: Should your screens look different and lack the field for the API key, you are most probably using outdated software. Update your Widgetkit 1 or Widgetkit 2 to their respective current version. Versions before 1.5.9 or 2.7.5 just do not have this field. Google only recently changed their policy. In the time before the new versions with the API key field were released, Googlemaps did not necessarily require the API key, so there was no field.
Make sure to save the changes.
If you use a "Maps" element in YOOtheme Pro the API key has to be entered into the field
Settings > Advanced > Google Maps
If you have an API key and it is entered in the Widgetkit/YOOtheme Pro settings, but you still get errors related to the API:
The "Geocoding" API is responsible for translating a literal address (with a street and city name for instance) to a location on the map. It is not to be confused with the "Geolocation" API! (Thanks to "lousyfool" for pointing that out.)
So if you wonder why entering an address to set the marker doesn't work, a missing or wrongly configured "Geocoding" API is most likely the cause.
Configure the "referers". With
mydomain.comas an example (replace that by your domain name!) you should set at least these two referrers:
Important: Depending on your domain, your Google account and several other aspects these settings could be different!
- Update:User "pawell" states that the "Google Places API Web Service" is also important to find an address. So activate this feature as well.
Where in doubt about the API and how to create or configure it, please refer to Google's manuals or ask your site's webmaster for assistance.
Once this is taken care of, the Googlemaps should be displayed as expected.