Google Maps ohne Fehlermeldung einbinden

Damit man auf der Suche nach dem lokalen Standort eines Unternehmens sofort sieht, wo man hin möchte sind eingebettete Google Maps Kartenausschnitte auf Webseiten heute Standard. Nachdem Google aber im Juli 2018 ein neues Preis- bzw. Abrechnungsmodell für den Dienst eingeführt hat, finden man auf vielen Websites heute statt einer funktionierenden Kartenansicht Fehlermeldungen wie: „Google Maps kann auf dieser Seite nicht richtig geladen werden“ oder „for development purposes only“.

Grund für die Fehlermeldung ist, dass die Nutzung von Google Maps grundsätzlich nicht mehr völlig kostenlos ist. Glücklicherweise gibt Google aber monatlich ein Freiguthaben in Höhe von $200.00. Für kleine bis mittlere Webseiten reicht dieses Gratis-Guthaben im Normalfall aus, sodass keine Kosten anfallen. Trotzdem muss man beim Einrichten eines Business Accounts auch ein Rechnungskonto erstellen und eine Kreditkarte hinterlegen.

API Key beantragen und Rechnungs-Konto eröffnen – So geht’s

Zunächst solltet man sich in seinem Google Konto anmelden. Im Idealfall ist das natürlich kein persönliches Konto, sondern das Google Konto indem auch andere Google Services (Google Analytics, Search Console, …) laufen.

Um den API Key zu beantragen geht man zunächst auf die Google Maps Platform unter https://cloud.google.com/maps-platform/und klickt dort auf „Jetzt starten“.

Schon öffnet sich ein Dialog, wo ein Produkt ausgewählt werden kann. Für die Einbettung von Google Maps Karten brauchen wir das Produkt „Maps“.

Im nächsten Schritt brauchen wir ein Projekt. Hier legen wir entweder ein neues Projekt an („+Create a new project“) oder – wenn man bereits einmal einen API Key beantragt hat, aber noch kein Rechnungskonto hat – wählt ein bestehendes Projekt aus.

Im letzten Schritt muss nun ein Rechnungskonto angelegt werden und auch eine belastbare Kreditkarte aktiviert werden. Anschließend wird die Google Maps API aktiviert und es öffnet sich ein Dialog mit dem benötigten API-Schlüssel.

Um wirklich sicherzugehen, dass der API Schlüssel nicht unerlaubterweise von anderen Seiten genutzt wird, kann man den Schlüssel auch einschränken, damit er z.B. nur auf einer Domain genutzt werden kann.Dazu einfach im Dialogfenster auf „Schlüssel einschränken“ klicken, dann „HTTP-Verweis-URLs (Websites)“ wählen und statt *.example.com/* die eigene Domain analog zum Beispiel eintragen (Der Stern vor dem Punkt schließt alle eventuellen Subdomain mit ein, der Stern nach dem Slash alle Unterseiten der Domain).

Anschließend den Codestring im Feld „Mein API-Schlüssel“ kann man nun im Backend seines CMS im jeweiligen Feld des Themes, Plugins, Moduls oder sonstigen, für die Maps Einbindung genutzten Erweiterung eintragen. Mit dem dort hinterlegten API Key sollte dann die eingebundene Karte ganz ohne Fehlermeldung oder Wasserzeichen funktionieren.

Wie gesagt, reicht die monatliche 200 $-Gutschrift für kleinere Webseiten im Normalfall aus. Damit können etwa pro Monat 25.000 dynamische Karten (Zoomen & Verschieben der Map möglich) geladen werden. Mit dem angebotenen Preisrechner kann man aber sicherheitshalber nachrechnen mit welchen Kosten zu rechnen.