Wenn du eine Karte in Divi einbinden möchtest, musst du nicht zwingend einen Google Maps API-Schlüssel verwenden. Mit OpenStreetMap und dem richtigen Embed-Code geht das komplett kostenlos und ohne API-Key.
Methode 1: OpenStreetMap via iFrame (einfachste Lösung)
- Rufe openstreetmap.org auf und suche deinen gewünschten Standort
- Klicke oben rechts auf das Teilen-Symbol (▷)
- Aktiviere die Option „HTML“ und kopiere den iFrame-Code
- Füge in Divi ein „Code-Modul“ (Custom HTML) ein
- Füge den iFrame-Code ein und passe Breite/Höhe nach Wunsch an
Methode 2: Google Maps einbetten (ohne API Key)
Für einfache Einbettungen ohne erweiterte Funktionen benötigst du keinen API-Schlüssel:
- Suche deinen Standort auf Google Maps
- Klicke auf „Teilen“ → „Karte einbetten“
- Kopiere den iFrame-Code und füge ihn in ein Divi Code-Modul ein
Methode 3: Divi Maps-Modul mit OpenStreetMap
Das native Divi Maps-Modul erfordert einen Google API-Key. Als Alternative nutze das kostenlose Plugin „Leaflet Maps Marker“ oder „WP Maps“, die beide OpenStreetMap unterstützen und eigene Divi-kompatible Shortcodes liefern.
Datenschutz-Tipp
OpenStreetMap sendet keine Nutzerdaten an Google. Für DSGVO-konformes Einbetten empfiehlt sich außerdem ein Cookie-Consent-Tool, das die Karte erst nach Zustimmung des Nutzers lädt.
Verwandte Artikel
Alternativen und Tipps zur kostenlosen Karte
Leaflet.js ist eine leichtgewichtige Open-Source-Bibliothek für interaktive Karten auf Basis von OpenStreetMap – völlig kostenlos, DSGVO-konform und ohne API-Key. Ideal für einfache Standortkarten.
Über Google Maps → Teilen → Karte einbetten erhältst du einen kostenlosen iFrame-Code. Dieser ist für die reine Anzeige auf Websites ohne API-Key nutzbar – gut für Kontaktseiten.
Jede Karteneinbindung, die externe Server kontaktiert, benötigt eine Einwilligung. Nutze Borlabs Cookie oder ein vergleichbares Consent-Tool, um die Karte erst nach Opt-in zu laden.
Hast du eine Frage zu diesem Artikel?
Schreib uns – wir antworten in der Regel innerhalb eines Werktages.