This thread is over two years old and may be outdated. Please create a new thread if you need help, or email us if you have an active Premium license.

Google maps not showing in widget

5 years ago · Last reply by Andrew Misplon 5 years ago

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.

This is our free support forum. Replies can take several days.

Need fast email support? Get SiteOrigin Premium

Replies

11
  1. Andrew Misplon Staff 5 years, 7 months ago

    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.

  2. Colin 5 years, 7 months ago

    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?

  3. Andrew Misplon Staff 5 years, 7 months ago

    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.

  4. Colin 5 years, 7 months ago

    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

  5. Andrew Misplon Staff 5 years, 7 months ago

    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.

  6. Colin 5 years, 6 months ago

    Hi Andrew, here’s the link to the page export: https://we.tl/t-PQG3aF6bHt

  7. Andrew Misplon Staff 5 years, 6 months ago

    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.

  8. Colin 5 years, 6 months ago

    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

  9. Andrew Misplon Staff 5 years, 6 months ago

    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.

  10. Andrew Misplon Staff 5 years, 6 months ago

    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.

  11. Andrew Misplon Staff 5 years, 6 months ago

    If the above still doesn’t help, I’ll send you an API key to test with.

Replies on this thread are closed.

Please create a new thread if you have a question, or purchase a SiteOrigin Premium license if you need one-on-one email support.

Have a different question or issue?

Start New Thread