Latest update(s) make Google Maps not visible

Hi Jack

Thanks for the update. If possible, please, send us a JSON export of the page in question. You can download the JSON file from Layouts > Import/Export > Download Layout while editing the page in Page Builder. You could then upload that file to WeTransfer.com or perhaps Dropbox/Drive etc. and send us the link. We’ll then be able to test the layout in question locally and provide feedback.

Hi Andrew and thank you for quick response!

Here you can download the json file: https://1drv.ms/u/s!AJjD7WphDpwOgbob
I can also add that I tried deactivating all other plugins except Page Builder and Widgets Bundle, flushed cache (WP-Super Cache) and even created a new page with the widget with same result.

/Jack

Thanks for the updates. The map seems to be loading ok on our demo site https://demo.siteorigin.com/corp/map-test/. I’ll be online again a bit later. Do you want me to let you know when I’m back online, we can perhaps schedule a time to check the issue live on your site?

Yes, please!
Thank you so much.

/Jack

Hi Jack, if you can recreate the issue live and let us know where to check, that’ll be great, thanks.

Hi Andrew,

I have installed latest update 1.17.10 again and face same problem again.
Page with the widget: https://sandbankarna.se/hitta-till-sandbankarna/

/Jack

Hi Jack,

I’ve had a look at the linked page, and this issue is caused by browsers blocking the maps CSS file due to it being served with an incorrect mimetype:

https://i.imgur.com/ZG5cgji.png

The file exists (this link will, however, break after you’ve changed any of the design settings) but it’s being served as a text file rather than a CSS file. When this type of issue occurs it’s typically due to a performance plugin incorrectly changing the mime type of the flagged file, or serving it in a manner that’s not playing well with the browser.

Can you please try disabling WP Super Cache in its plugin settings, and then disabling the plugin. Does this issue remain? If it does, are there any other performance plugins present on your website? If so, can you please clarify what they’re called? I’ll take a look at that plugin and see if I can work out what’s going on.

It’s possible this issue is caused by a modification to a .htaccess and if that’s the case a plugin conflict test won’t be able to identify this.

Kind regards,
Alex

Hi Alex,
I have tried to inactivate, and even uninstall, WP Super Cache with no result. Also tested to removed some code from the .htaccess file (Cache-Control Headers), but the problem resists.

I really don’t know what to do next, and why is it that when I preview the page, both in the Google Maps widget and WordPress page preview, everything looks ok? And when I roll-backed the plugin to version 1.17.08, everything works fine.

/Jack

Hi Jack,

We’ve moved some of the CSS the map uses to the CSS file the widget uses to allow for it to be better cached by browsers. This means that it’s possible this issue was always present on your site but wasn’t noticeable due to the relevant CSS being inline rather than in the dedicated stylesheet.

Would it be possible for you to provide me with a copy of your .htaccess file? This will allow me to look over it and flag any potentially related lines. Also, do you have any .htaccess files present in your uploads directory? If so, it’s possible those may be related so please provide me with a copy of those also.

Kind regards,
Alex

Hi Alex,

I have uploaded two .htaccess file, one from the root folder and one from the uploads folder. Both files are renamed to separate their location.

Download from here: https://1drv.ms/u/s!ApjD7WphDpwOgbolqtnJexSvfukiPw?e=8VAzs9

Kind regards
Jack

I found out that if I take this CSS code from the file sow-google-map-default-6b23895f316e.css that is located in /wp-content/uploads/siteorigin-widgets/ folder and put it in the child-themes style.css everything works.

.so-widget-sow-google-map-default-6b23895f316e .sow-google-map-canvas {
height: 480px;
}

Of course this is a dirty fix and I’m wondering if the digits (6b23895f316e) in the filename may change in a future update to the plugin. Then it would not work again. I tried with doing a minor change in the widget and it seemed that filename did not change.

/Jack

Hi Jack,

Thanks. I’ve tried the provided map layout and it’s working without issue for me.

I don’t see any direct changes of the CSS file mime type in any of the provided files, but I do see mod_gzip being used. Depending on how the server is set up that could be causing this issue.

Please temporarily remove these lines in your .htaccess file:

<ifModule mod_gzip.c>
mod_gzip_on Yes
mod_gzip_dechunk Yes
mod_gzip_item_include file .(html?|txt|css|js|php|pl)$
mod_gzip_item_include handler ^cgi-script$
mod_gzip_item_include mime ^text/.*
mod_gzip_item_include mime ^application/x-javascript.*
mod_gzip_item_exclude mime ^image/.*
mod_gzip_item_exclude rspheader ^Content-Encoding:.*gzip.*
</ifModule>
#
# BEGIN Cache-Control Headers
<IfModule mod_expires.c>
  <IfModule mod_headers.c>
    <filesMatch "\.(ico|jpe?g|png|gif|swf)$">
      Header append Cache-Control "public"  
    </filesMatch>
    <filesMatch "\.(css)$">
      Header append Cache-Control "public"
    </filesMatch>
    <filesMatch "\.(js)$">
      Header append Cache-Control "private"
</filesMatch>
    <filesMatch "\.(x?html?|php)$">
      Header append Cache-Control "private, must-revalidate"
    </filesMatch>
</IfModule>
</IfModule>

Open your website in a private/incognito mode and then view the page that contains your map. Does it work as expected now?

Of course this is a dirty fix and I’m wondering if the digits (6b23895f316e) in the filename may change in a future update to the plugin.

These numbers will change after updating the widget design settings, or plugin. They’re unreliable. You can safely remove that class as while this issue is occurring on your website no other CSS will be able to be loaded that will override it.

Kind regards,
Alex

Hi Alex,

I have temporarily removed those lines in .htaccess and also disabled the css fix and now it’s back to a blank page where the map should be.

Kind regards
Jack

Hi Jack,

That’s great to hear! ??
Please re-add the removed lines and then reach out to your hosting provider about CSS having their mime time changed to plain/text when they’ve been gzipped.

Kind regards,
Alex

Hi Alex,

Ok, I will do that and wait for their response.
Thanks for all your help, I let you know how it goes.

Kind regards
Jack