This tutorial will show you how to deal with ‘This page was unable to display a Google Maps element’ error in Joomla templates.
Google announced some changes to the Google Maps APIs authentication and usage limits.
Usage of the Google Maps APIs now requires a key. If you are using the Google Maps API on localhost or your domain was not active prior to June 22nd, 2016, it will require a key going forward. This is why such error occurs.
To resolve the issue, follow the steps below:
Select ‘Create a project’ option and click on ‘Continue’;
Specify the required credentials: Name, Website URL and hit the ‘Create’ button;
Copy your new API Key:
Login to Joomla Dashboard and navigate to Extensions > Plugins section;
Open the ‘Google Maps’ plugin for editing:
Navigate to the ‘General Settings’ tab;
Scroll down and paste your newly created API key into the ‘Googlemaps API Key’ field and save the changes;
Refresh your website. Google Maps work properly now.