Google Maps auf Website einbinden: Alle Funktionen & 5 Wege

Wie kann man Google Maps auf die Website einbinden? In folgendem Blog-Beitrag zeige ich 5 Wege wie Sie Google Maps in die Website einbinden können und auf was Sie dabei achten müssen.

Google Maps in Website einbinden: Was sollte man beachten

Wer Google Maps auf der Website einbinden möchte, sollte ein paar Punkte beachten.

a) Google Maps auf Website einbinden rechtlich erlaubt?

Anmerkung: Dieser Abschnitt stellt keine Rechtsberatung dar. Für genauere Informationen sollten Sie einen Anwalt konsultieren.

Eine gewerbliche Nutzung von Google Maps ist nur unter der Voraussetzung der Verwendung der Google Maps API erlaubt. Eine API ist eine Programmschnittstelle, mit deren Hilfe sich Google Maps in die Website integrieren lässt. Um den API-Schlüssel zu generieren, muss man sich in der Google Cloud Platform anmelden. Eine Schritt-für-Schritt-Anleitung wie das Erstellen eines API-Keys funktioniert gibt es hier.

Was man noch beachten sollte: Die Einbindung von Google Maps in die Website mittels eines Screenshots wird von Google untersagt. 

b) Wie kann man Google Maps datenschutzkonform einbinden?

Anmerkung: Dieser Abschnitt stellt keine Rechtsberatung dar. Für genauere Informationen sollten Sie einen Anwalt oder Datenschutzbeauftragten konsultieren.

Da Google ein in den USA ansässiges Unternehmen ist und beim bloßen Anschauen von Google Maps Nutzerdaten verarbeitet werden, muss man beim Einbinden von Google Maps in die Website sich definitiv mit dem Thema Datenschutz auseinandersetzen.

Welche Nutzerdaten werden beim Anschauen überhaupt verarbeitet? Die IP-Adresse des Nutzers.

Die Datenschutzgrundverordnung (DSGVO) schreibt vor, dass ein Website-Nutzer ausdrücklich vor dem Laden von Drittanbieter-Tools wie z.B. Google Maps informiert werden muss, dass ggf. personenbezogene Daten an Google weitergeleitet werden. Website-Nutzer müssen also darüber informiert werden und ihre Zustimmung geben.

Wer aufgrund von Datenschutz-Aspekten Bedenken hat Google Maps in die eigene Website einzubinden, hat nur wenige Alternativen zur Auswahl.

c) Google Maps einbinden, sodass Routenplaner bzw. Wegbeschreibung abrufbar?

Wer auch eine Routenplaner-/Wegbeschreibungsfunktion nutzen will, sollte darauf achten, dass diese Funktion beim Einbinden von Google Maps in die Website funktioniert. Jedes Widget bzw. jeder Website-Baukasten und jedes CMS haben ihre Eigenheiten.

d) Mehrere Standorte mit Google Maps in Website einbinden

Darüber hinaus, kann man auch mehrere Standorte in Google Maps anzeigen oder seinen Nutzern ermöglichen, den bestmöglichen Standort zu suchen.

Da jeder Website-Baukasten bzw. jedes CMS und deren Plugins unterschiedliche Funktionsumfänge haben, sollte man bei der Auswahl der Tools darauf achten.

e) Interaktive Elemente einbinden

Es gibt verschiedene Möglichkeiten Google Maps mit interaktiven Elementen in die Website einzubinden:

• Dynamische Karten, die individuell gestaltet werden können
• Autovervollständigung bei der Suche
• Details zu den Standorten oder auch Sonder- und Prämienangebote anzeigen

f) Weitere lokale Informationen in Umgebung anzeigen?

Wollen Sie Ihren Nutzern weitere Informationen zu Geschäften und Attraktionen in der Nähe Ihres Standorts anzeigen? Auch das ist möglich. 

g) Entstehen Kosten beim Einbinden von Google Maps in die Website?

Wie ist es mit den Kosten von Google Maps. Hier muss man auf drei Aspekte achten:

1. Nutzungs-Kosten von Google Maps: Bis 28.500 monatlichen Kartenaufrufen ist Google Maps kostenlos nutzbar. Das dürfte für fast jedes lokal agierende Unternehmen locker ausreichen.
2. Kosten von Tool bzw. Plugin zur Einbindung von Google Maps in die Website: Hier können ggf. (monatliche) Kosten entstehen.
3. Kosten eines Dienstleisters wie z.B. eines Webdesigners, der die Umsetzung vornimmt (falls Sie es nicht selbst machen).

5 mögliche Wege, um Google Maps in die Website einzubinden

1. Mit dem Elfsight Google Maps Widget 

Mit dem Elfsight Google Maps Widget hat man einen echten Alleskönner: 

• Zum einen kann man sämtliche der oben genannten Funktionen nutzen, und somit eine ganz individuelle Version von Google Maps in die Website einbinden (z.B. eigenes Icon, verschiedene Farben oder angezeigte Menüpunkte).
• Zum anderen kann das Elfsight Google Maps Widget ganz einfach in jede Website eingebunden werden – von Websitebaukästen wie Jimdo oder Wix über WordPress bis hin zu Shopify.
• Den API-Key kann man unkompliziert hinzufügen ohne ihn händisch in einen Code integrieren zu müssen.

Elfsight bietet auch eine kostenlose Version*, mit der man Google Maps in die Website einbinden kann.

2. Mittels Wordpress Widgets Google Maps in Website einbinden

Auch bei den meisten WordPress Widgets kann man viele der oben genannten Funktionen nutzen.

Drei der bekanntesten WordPress Google Maps Widgets sind:

• WP Google Maps 
• Maps Widget for Google Maps 
• WP Store Locator

3. Ohne Widget Google Maps in Website einbetten

Wer auf sämtliche der oben genannten Funktionen verzichten kann, und nur einen bestimmten Kartenausschnitt anzeigen möchte, kann Google Maps ganz einfach per iframe einbinden. So geht's:

1. Google Maps öffnen
2. Gewünschten Kartenausschnitt einstellen / bzw. heran oder herauszoomen
3. Hamburger-Menü öffnen (links oben über Suchfenster)
4. Auf „Karte teilen oder einbetten“ klicken
5. Im sich öffnenden Fenster auf „einbetten“ klicken
6. Die Größe des Karten-Ausschnitts einstellen (klein, mittel, groß)
7. Code kopieren
8. In html-Code der Website einbinden

Achtung: Als gewerblicher Nutzer sollte man nicht vergessen den API-Key in den Code zu integrieren.

4. Individuelle Karte mit Google My Maps gestalten

Fast schon ein Geheimtipp: Google My Maps wurde hauptsächlich für die private Nutzung und das Teilen mit Freunden geschaffen. 

Doch auch Unternehmen können von den vielen Funktionen profitieren: Das Generieren einer Google Maps-Karte mit Google My Maps geht ganz einfach geht . Auch diese Karte kann man per iframe in die Website einbinden.

Achtung: Als gewerblicher Nutzer sollte man auch bei dieser Lösung nicht vergessen den API-Key in den Code zu integrieren.

5. Spezielle Karten über Google Cloud Partner 

Wer ganz spezifische/individuelle Bedürfnisse für das Einbinden von Google Maps hat, kann sich auch an einen sogenannten Google Maps Platform Partner wenden. Allerdings ist dies die mit Abstand teuerste Lösung und dürfte für die meisten lokalen Unternehmen kaum erschwinglich sein.

*Die mit Sternchen (*) gekennzeichneten Links sind sogenannte Affiliate-Links bzw. Werbelinks. Wenn Sie auf einen Affiliate-Link klicken und über diesen Link einkaufen, bekomme ich von dem betreffenden Anbieter eine Provision ohne dass sich für Sie der Preis des Produkts ändert.