Hi there,
I was using your theme but there seems to be a conflict with Google Maps field from the ACF plugin. The map won’t show up. It shows but its glitched out, the tiles are blank, some buttons are wonky. Likely a conflict with the maps features of this theme. I’m not sure how to fix it.
I don’t have a URL anymore since I had to switch to another theme for now.
Thanks!
Ryan
Hi Ryan
Could you try the following:
Appearance > Customize > Theme Design > Page > Image Shadow and Rounding. Is that enabled? If so, disable it.
If that doesn’t help then we would need to see the problem, even just briefly. Perhaps we could setup a time to do that. Check the above first though. Thanks.
Hi there,
I don’t have any Theme Design, there is Theme Settings, but no Page and no Image Shadow and Rounding anywhere. Perhaps a different theme than Vantage?
Thank you!
Take another quick look for us :) Appearance > Customize then Theme Design. Did you click Customize under Appearance?
Sorry, my bad. Too tired I guess. Well that didn’t fix it but thats ok.
It’s literally just a blank map, with no tiles, there is a map marker that I added though. But no javascript errors that I can see or missing files not loading. The zoom in and out and pan buttons have their images missing or glitchy but I’m not sure if thats just a google maps issue or an ACF issue or what exactly that’s from. The zoom in and out + and – sign icons look vertically sliced and spaced out a bit and disappear when hovered over. The pan icon is missing completely. But all their square white button shapes are there and appear fine, just the icons inside aren’t working properly. Everything else seems normal to me other than that. Maybe a CSS conflict or something somewhere? I dunno.
I’ve tried in FireFox, Chrome, Opera and it looks the same in all of them. It seems like it just isn’t the theme this particular site needs. No worries =)
Let me know if you’d like to dig deeper.
Perhaps, try de-activating FitVids, you can do that from Appearance > Theme Settings > Layout.
Well you got me to dig deeper and I figured out the issue. The idea of a CSS conflict stuck in my mind so I went exploring inside the google map DOM seeing what styles affected the button icon images. Turns out it actually was a CSS conflict.
I had to use the following CSS to counter the .entry-content img {max-width:100%;} style in the theme which it seems many themes actually have.
.acf-map img { max-width: none !important; }Thank you for your patience and persistence!
Nice find! The rule you mentioned is import for general image responsiveness. Thanks for sharing the fix with everyone else :)
All the best.