I’ve set up Google Maps and got my API, entered it into the Google Maps widget settings.
However, when I go into the page widget and edit it, the map centre is blanked out. It asks me to enter my API code and the link keeps taking me to a different Google account from that in which I’ve set up the API. So I can’t enter the map centre.
If I preview or update the page, the map area is blank. In fact it doesn’t even have a space where the map should be.
Is there a delay between Google updating the APIs or have I done something wrong (or not done something)? I’ve followed the video you created to set up my Google Map and restrict the map to any variations of my domain.
Hi Colin
Good to hear from you.
Try opening the browser console when the issue occurs to see what the error is. You might have to add your URL to the API access list. Here is how to open the browser console https://wordpress.org/support/article/using-your-browser-to-diagnose-javascript-errors/#step-3-diagnosis.
Let us know how it goes.
Thanks for your reply Andrew. I’ve already set the URL limits to *coach-network.co.uk/* The error message doesn’t mean anything to me but the error on the page (https://coach-network.co.uk/stage/1594833787106/?page_id=38) is:
Failed to load resource: the server responded with a status of 400 ()
?page_id=38:1 A cookie associated with a cross-site resource at http://google.com/ was set without the `SameSite` attribute. A future release of Chrome will only deliver cookies with cross-site requests if they are set with `SameSite=None` and `Secure`. You can review cookies in developer tools under Application>Storage>Cookies and see more details at https://www.chromestatus.com/feature/5088147346030592 and https://www.chromestatus.com/feature/5633521622188032.
?page_id=38:1 A cookie associated with a cross-site resource at https://google.com/ was set without the `SameSite` attribute. A future release of Chrome will only deliver cookies with cross-site requests if they are set with `SameSite=None` and `Secure`. You can review cookies in developer tools under Application>Storage>Cookies and see more details at https://www.chromestatus.com/feature/5088147346030592 and https://www.chromestatus.com/feature/5633521622188032.
?page_id=38:1 A cookie associated with a cross-site resource at https://www.google.com/ was set without the `SameSite` attribute. A future release of Chrome will only deliver cookies with cross-site requests if they are set with `SameSite=None` and `Secure`. You can review cookies in developer tools under Application>Storage>Cookies and see more details at https://www.chromestatus.com/feature/5088147346030592 and https://www.chromestatus.com/feature/5633521622188032.
?page_id=38:1 A cookie associated with a cross-site resource at http://www.google.com/ was set without the `SameSite` attribute. A future release of Chrome will only deliver cookies with cross-site requests if they are set with `SameSite=None` and `Secure`. You can review cookies in developer tools under Application>Storage>Cookies and see more details at https://www.chromestatus.com/feature/5088147346030592 and https://www.chromestatus.com/feature/5633521622188032.
3onloadwff.js:71 Failure with checking formfill: TypeError: Cannot read property ‘aid’ of null ln: undefined
maps.googleapis.com/maps/api/staticmap?center=445%20East%2086th%20Street,%20445%20E%2086%20W%2027th%20St%20#%20601,%20New%20York,%20NY%2010028,%20USA&zoom=12&size=640×500&key=AIzaSyBb6mFBXHKwYlfFauDnShjQWVe7nx0R-nY&style=feature:landscape.natural|element:geometry.fill|visibility:on|color:0xe0efef&style=feature:poi|element:geometry.fill|visibility:on|hue:0x1900ff|color:0xc0e8e8&style=feature:road|element:geometry|lightness:100|visibility:simplified&style=feature:road|element:labels|visibility:off&style=feature:transit.line|element:geometry|visibility:on|lightness:700&style=feature:water|element:all|color:0x7dcdcd&markers=445%20East%2086th%20Street,%20445%20E%2086%20W%2027th%20St%20#%20601,%20New%20York,%20NY%2010028,%20USA&scale=2:1 Failed to load resource: the server responded with a status of 400 ()
3DevTools failed to load SourceMap: Could not load content for chrome-extension://hdokiejnpimakedhajhdlcegeplioahd/sourcemaps/onloadwff.js.map: HTTP error: status code 404, net::ERR_UNKNOWN_URL_SCHEME
Does this mean anything to you?
There doesn’t appear to be an error linked to the Maps API there. If you’d like to make the page public, we’ll take a look. Thanks.
Thanks Andrew
Didn’t realise I needed to do that. Sorry. Page is now public: https://coach-network.co.uk/stage/1594833787106/?page_id=38
Thanks, there is a 400 error (bad request) related to the map in the console. I’m not sure why that would the case. If you send me an export of the page, I’ll try it locally and see if it works for me. In Page Builder: LayoutsImport/ExportDownload Layout. Upload the JSON file to WeTransfer.com or any cloud site and send me the link. Thanks again.
Hi Andrew, here’s the link to the page export: https://we.tl/t-PQG3aF6bHt
Thanks. Google doesn’t seem to be finding the full address, I’m not sure why that’s the case. If I simplify the address to 445 East 86th Street I then get a drop-down prompt and select the suggestion. I changed the map to Interactive to get full-width but I could load it as static too once I had stripped down the address a bit.
Hi Andrew, how did you manage to change the address? I can’t click on the Map Centre address field of the Site Builder editing page. The address you have is the default address of the widget.
Here’s a screenshot of what I get in the widget editing screen:
https://we.tl/t-psjB5ZVPCC
Thanks for the screenshot. The address field is normally editable. The issue you’re seeing with the icons over the field suggests there is an API issue.
This is a hard one to assist with but ideas I’d try:
1. At PluginsSiteOrigin Widgets, I’d double-check to make sure the saved API is correct.
2. In the Google API console, confirm that the Maps and Maps Static API’s are enabled.
3. Confirm that the site URL is added to the key or temporarily open the key up by removing URL restrictions.
If the above still doesn’t help, I’ll send you an API key to test with.