tl;dr: Karteneinbindungen sind bei vielen Seiten sinnvoll. Wer auf den freien Dienst OpenStreetMap setzt kann auf verschiedene Erweiterungen im Elementor-Universum zurückgreifen.
Im Unterschied zu Google Maps verwendet OpenStreetMap offenes Kartenmaterial. Die Urheberschaft wird automatisch innerhalb des Kartenfensters angezeigt, damit wird auf die Urheberschaft der Karte ausreichend hingewiesen. Eigentümer von OSM ist die OpenStreetMap Foundation mit Sitz im Vereinten Königreich. Damit ist der Eigentümer zwar nicht in den USA, aber trotzdem ausserhalb Europas: eine Opt-In Möglichkeit (also die Zustimmung des Users zur Übermittlung seiner IP-Adresse an den Kartenserver) wird also notwendig sein.
Wer die Erweiterung Dynamic Content for Elementor einsetzt kann auf zwei Widgets mit unterschiedlichen Funktionen zugreifen. Wer für sein Projekt auf andere Funktionen dieses Paketes zugreift kann diese Widgets unter Dashboard > dynamic.000 > Features / Widgets aktivieren.
Das einfachere und im wesentlichen mit der Elementor eigenem Google Maps-Funktion vergleichbare Tool heisst einfach OpenStreetMap. Unter Location wird die Wunschadresse eingetragen oder die Koordinaten der gewünschten Position. Sonst muss man noch die Zoomstufe Definieren und die Höhe der Karte festlegen. Das war’s auch schon, im Stil-Menü lassen sich noch CSS Effekte auf die Karte anwenden, mehr gibt es nicht, mehr braucht man aber auch oft nicht.
Dieses Widget von Dynamic Content ist mit mehreren Funktionen ausgestattet:
So gut wie alle Werte können auch dynamisch eingebunden werden. Damit lassen sich Karten mit mehreren Marken auch aus eigenen Post Typen erstellen.
Die erste Eingabe Datentypen unterscheidet zwischen Adressdaten und Latitide / Longitude. 2teres ist praktisch, sollten die Koordinaten in getrennten Feldern vorliegen, in der üblichen Schreibweise mit , können Koordinaten auch im Adressfeld eingegeben werden (zB: 48.22632884062178, 14.882352756111745) .
Die Auswahl für Kartentyp (siehe die 3 Beispiele ) zeigt nicht nur andere Farben: je nach Auswahl werden auch andere Inhalte angezeigt, zu zeigt zB die Auswahl Hot genauere Bezirksgrenzen am obigen Beispiel, dafür ist aber die Fahrardfähre nicht eingezeichnet.
Jeder einzelne Marker kann mit einem eigenen Icon gesetzt werden, wobei hier Breite und Höhe eingestellt werden können. Zusätzlich gibt es eine Option für ein Custom Info Window, das im Wesentlich ein Tooltip mit Text ist.
Der Kartenausschnitt wird automatisch so gesetzt, dass alle Marker sichtbar sind. Im Beispiel oben wurden 2 Positionen gesetzt die etwa 4 km von einander entfernt sind. Die Option Circles erlaubt um alle Punkte einen Umkreis (hier 500m) anzuzeigen
Jeder der schon mal über eine Karte gescrollt ist kennt das Problem: plötzlich scrollt man nicht mehr sondern zoomt in eine Karte. Welche Controlling-Optionen man für die Kartenanbindung aktivieren will kann in einem eigenen Tag eingestellt werden.
Im Stil-Tab können wie beim Widget zuvor CSS-Filter gesetzt werden. Zusätzlich findet man hier Einstellungsmöglichkeiten für das Optionale Info-Window für jeden Marker bzw. die Ausgestaltung der Circles.
Das kostenfreie Plugin mit dem etwas sperrigen Namen OSM Map Widget for Elementor geht funktional noch einige Schritte weiter als die zuvor beschrieben. Es erlaubt durch Eingabe eines Google Maps API Keys die Autocomplete-Funktion von Google zu nutzen. Weiters kann man auch Mapbox Access Token eingeben, einen Dienst der Karten und Location-Services für Developer zur Verfügung stellt. Ein weiterer Dienst der eingebunden werden kann ist Geoapify, ebennfalls ein Developerservice für Kartenfunktionen.
Alle diese Optionen können schnell kostenpflichtig werden, ja nach Nutzung der Services. Aktuell (Juni 2023) hat das Plugin 7000 Installationen, das letzte Update ist etwa 7 Monate her.
Funktional ist das Widget mit jenem zuvor beschriebenen sehr ähnlich. Es lassen sich mehrere Marker setzen, allerdings lässt sich nur ein Marker Icon auswählen – für alle Punkte.
Das Info-Window hat einen optionalen Button, es können also Links zu jedem gesetztem Punkt eingetragen werden.
Im Stil-Tab unter Tile lassen sich verschiedenen Kartendesigns auswählen. In der Auswahl sind die freien Tiles als solche gekennzeichnet.
Die verschiedenen Optionen für Marker Icon, Marker Title, Marker Content und Marker Button sind wie zu erwarten und üblich.
Die beiden Beispiele unten zeigen kostenlose Tiles: Stamen Terrain und Stamen Watercolor. Damit können Karten mehr als nur reine Infografiken werden.
Wer Elementor mit OpenStreetMap verwenden will hat eine gute Chance, eine passende Erweiterung zu finden. Von einfach und kostenlos bis dynamisch komplex und anspruchsvoll gibt es sicher eine passende Lösung. Und: man muß keine Google-API verwenden um ansprechendes Kartenmaterial auf seiner Webseite einzubinden.
