WP Google maps appears gray only with Illdy theme // CSS problem?

Hello,
First of all, thanks to the team for the beautiful themes and support.
I’m using Illdy and I have trouble using WP Google maps widget.
The map works perfectly with other themes (so it looks like it isn’t an API key or JS problem). But as soon as I switch back to Illdy, the map becomes a grey rectangle, with the marker standing in the middle of a gray ocean.
I am guessing it is a problem with the CSS. I’ve seen some suggestions to add to the default CSS, unfortunately none of them has worked.
Any ideas on how I could solve this?
Thank you so much!

PS: the problematic map is in http://www.timonet.studio/experiencemontagne/index.php/contact/, although it’s a pre-pre-production page.

Hi,

You sure switching to a default theme on this same pre-pre-production page makes the map displays with all the same plugins? Try disable all the third-party plugins or try some other Google Maps plugins and see how it works.

Let us know,

Thanks,
laranz.

Hi,
Thanks for your answer.
Yes, without changing anything else, I go to the dashboard and change the theme, and the map displays properly.
I’ve tried with other google maps plugins (MapPress Easy Google Maps) and it displayed alright. The extension itself is now disabled, so I don’t think it can interfere with the page.
The page has a contact form (from contact form 7), I’ve tried removing the form, it doesn’t make any difference.
Funny thing, if you drag the map to the right, it starts displaying a map (the gray part moves to the right, like opening a curtain), but if you drag to any of the other 3 directions, nothing, gray all the time.
I hope we can solve the mystery!
Thanks,
Sara

Hi Sara,

Sorry I didn’t understand the issue, can you pass us the WP Login details using the Private reply, and then steps to re-create the issue, so that we can check what is going wrong.

Let us know,

Thanks,
laranz.

Hi Iaranz,
Thank you for your answer, unfortunately, I have to present some functional stuff tomorrow, so I’ve decided to go with another Google Maps plugin.
I’ve also informed WPGoogleMaps team about this weird behaviour.

Last think I was checking is if JS would reset to a default that would mess up the CSS.
I noticed that when moving the cursor (dragging the map) , when the tx in the matrix in the div B gets to negative numbers, the screen is gray.
<div A>
position: absolute; z-index: 0; left: 0px; top: 0px; height: 100%; width: 100%; padding: 0px; border-width: 0px; margin: 0px; cursor: url(“https://maps.gstatic.com/mapfiles/openhand_8_8.cur”) 8 8, default;
<div B>
z-index: 1; position: absolute; top: 0px; left: 0px; width: 100%; transform-origin: 0px 0px 0px; transform: matrix(1, 0, 0, 1, 210, 128) //will-change: transform//;

But maybe this has nothing to do with it, unfortunately right now I don’t have more time to keep exploring, but I hope it will help, as I’ve seen several other forum threads (here and in WPGoogleMaps) with people having the same issues.

Thanks again, if you ever find a solution, please, let me know!

Hi @timonet

thank you for sharing the solution, to be honest, I’m almost sure if this is a theme issue or not, most probably plugin cause, but since you decided to move lets close this story here :slight_smile:

Hi,

Then it is a issue with that plugin “WPGoogleMaps” you can try some other google map plugin then, or try configure the plugin correctly.

Let us know,

Thanks,
laranz.