Wer kennt das nicht? Man scrollt in eine eingebettete Google Maps hinein und anstatt die Seite weiter zu scrollen, zoomt die Karte. So gesehen beim WordPress Plugin Events Manager, das ich sehr schätze. Hier werden Veranstaltungsorte in Google Maps auf der Webseite eingebettet dargestellt.
Wie kann man das lästige Verhalten verhindern? Ganz einfach über die Modifizierung der entsprechenden Dateien aus dem Plugin mittels ein wenig Javascript:
Template Dateien Kopieren
/wp-content/plugins/events-manager/templates/placeholders/locationmap.php
nach
/wp-content/themes/meintheme/plugins/events-manager/placeholders/locationmap.php
kopieren.
Und:
/wp-content/plugins/events-manager/templates/templates/map-global.php
nach
/wp-content/themes/meintheme/plugins/events-manager/templates/locationmap.php
kopieren. „meintheme“ ist dabei jeweils das eigene Theme. Achtung, von WordPress bezogene Themes direkt zu optimieren ist nicht empfohlen, da bei Theme-Updates alle Änderungen verloren gehen. Hier empfiehlt es sich ein Child-Theme anzulegen und alle Änderungen am Theme über das Child-Theme, das beim Update nicht überschrieben wird, durchzuführen. Alternativ schnappt man sich ein WordPress-Theme und ändert es in ein eigenes Theme um, sodass es nicht mehr von offiziellen Updates betroffen ist. Aber Achtung: Eventuelle Sicherheitslücken und Optimierungen am Theme fließen dann nicht mehr in das eigene Projekt mit ein – es sei denn man gleicht den Code regelmäßig ab und führt die Dateien zusammen (Arbeit!).
Javascript hinzufügen
Nun optimieren wir die Dateien in
/wp-content/themes/meintheme/plugins/events-manager/placeholders/locationmap.php
und
/wp-content/themes/meintheme/plugins/events-manager/templates/locationmap.php
indem wir folgenden Javascript code hinzufügen (an das Ende der Dateien):
<script type="text/javascript">
jQuery(document).bind('em_maps_locations_hook', function( e, map, infowindow, marker ){
map.set('scrollwheel', false);
});
</script>Fertig! Nun sollten die Karten beim überscrollen nicht mehr zoomen.