Why isn’t Google Maps working on my WordPress site anymore?

If your site is using a plugin to load an address—like the Events Calendar Plugin—you may have noticed the error message “This page can’t load Google Maps correctly” blocking the map’s display.

 

 

As of June 11, 2018, Google Maps is no longer supporting keyless usage of their API. You will need to enable billing and have a valid API key. Google is offering a monthly credit, so you can continue to use the Google Maps API potentially at no cost.

Per Google, “You must have a valid API key and a billing account to access our APIs. When you enable billing, you will get $200 free usage every month for Maps, Routes, or Places. Based on the millions of users using our APIs today, most of them can continue to use Google Maps Platform at no cost with this credit. Having a billing account helps us understand our developers’ needs better and allows you to scale seamlessly.” Google offers a user guide to help you get started.  

ITECS recommends using a Google generic account to keep track of access to API keys. If your team does not have one yet, please visit the Web Registry to request one.

What if I don’t want to set up a billing account?

A way to continue using Google Maps for free is to copy the URL of the location and use a link on your site to direct someone who clicks on it to a separate browser page. If you are trying to highlight a location at NC State, try the interactive campus map. Similarly to Google Maps, once you search for a building name, copy the URL to use as a link. The interactive NC State campus map also includes a “Get Directions” button which opens Google Maps in a separate browser tab.

 

To use the NC State Campus Map in your site:

  1. Go to https://maps.ncsu.edu
  2. Enter in the name of a building, in this case Engineering Building 1. The address to a building will not work. 

NCSU interactive campus map with EB1 highlighted

3. Once you’ve found the building, copy the URL at the top of the page.

The URL to locate the EB1 building on NC State's Centennial Campus using the campus map.

4. Put that URL directly into an anchor tag, or in any number of blocks such as the paragraph or “Major Links” block. The “Major Links” block is part of the NC State Blocks plugin. Email the Engineering IT help desk at eoshelp@ncsu.edu to have this plugin installed on your WordPress site — please note that this plugin only works on block editor themes such as Hillsborough.

Published in .