SVG root element is making google ad link unclickable WordPress
- SOLVED
I added Google Ads feature to my mapping plugin "Leaflet Maps Marker" - unfortunately on maps with an SVG root (for vector layers) the ad is not clickable (in contrast to maps without vectory layers = second map on demo site).
More info on the demo site at http://pro.mapsmarker.com/?p=40
Additionally to the 10$ here I am giving away a pro license worth €39 including 1 year access to updates and support for a real fix ;-)
Answers (4)
zebra webdesigns answers:
I dont know if this is right solution.
But visually its not affecting anything and the ad is clickable.
add the follwing CSS and see if that works for you
.leaflet-overlay-pane svg {
display: none;
}
Robert Seyfriedsberger comments:
thx but not a solution - also hides the markers on the map
zebra webdesigns comments:
I dont see any markers hiding Can you explain using a screenshot of what you are referring so that it will be helpful to view clear
Robert Seyfriedsberger comments:
I will check again & let you know the results (I remembered that I already tried something similar and all markers got hidden - anyway, will check again)
Robert Seyfriedsberger comments:
that was the right approach - could fix it with that, thanks! regarding the free pro license: please start a free trial by downloading and installing the plugin from www.mapsmarker.com and send me an email once you started a free personalized trial so that I can assign your user the unexpiring pro license
best,
Robert
Balanean Corneliu answers:
The zebra solution its working for me.
Balanean Corneliu comments:
What browser you are using ?
Ross Wilson answers:
When I made the leaflet-map-pane div come before the leaflet-google-layer div in the html the ad is clickable
Edit: Actually, that hid the markers as well.
It looks like you need to make the html look like this:
<div class="leaflet-google-layer"></div>
<div class="leaflet-map-pane"></div>
<div class="leaflet-lmm-google-ad"></div>
Duncan O'Neill answers:
A quick hack solution?:
.leaflet-zoom-animated { visibility:hidden;}
It seems to work with zooming and dragging.