Google Maps API für Frymo einrichten #
Mit Frymo präsentierst du deine Immobilien professionell auf deiner WordPress-Webseite – inklusive interaktiven Karten, automatischer Adresserkennung und komfortabler Autovervollständigung. Damit alles zuverlässig funktioniert, musst du zwei API-Keys korrekt konfigurieren: einen für die Karten im Frontend und einen für serverseitige Adressdienste.
Warum jetzt zwei API-Keys? #
Frymo bietet dir ab sofort zwei Eingabefelder – denn Google erlaubt pro API-Key nur eine einzige „Application Restriction“. Damit du sowohl Frontend- als auch Backend-Anfragen sauber absichern kannst, werden die Keys getrennt:
- Frontend Key: Maps JavaScript API, Maps Embed API (läuft im Browser)
- Backend Key: Geocoding API, Places API (läuft vom Webserver)
Wenn du keine Anwendungseinschränkungen auf deinem Google API-Key setzt, kannst du den gleichen Key einfach in beide Input-Felder eintragen. Sobald du jedoch Sicherheitsbeschränkungen aktivieren willst, brauchst du:
- Frontend-Key mit HTTP-Referrer-Restriction (Domain)
- Backend-Key mit IP-Restriction (Server-IP)
Benötigte Google-APIs #
| API | Zweck | Ort | Zu verwendender Key | Empfohlene Beschränkung |
|---|---|---|---|---|
| Maps JavaScript API | Interaktive Kartenanzeige | Frontend (Browser) | Frontend-Key | HTTP Referrer |
| Maps Embed API | Einfache Karteneinbettungen | Frontend (Browser) | Frontend-Key | HTTP Referrer |
| Geocoding API | Adressen <→ Koordinaten | Backend (Server) | Backend-Key | IP-Adresse des Servers |
| Places API | Autocomplete & Ortsvorschläge | Backend (Server) | Backend-Key | IP-Adresse des Servers |
API-Keys erstellen #
Du benötigst nun zwei API-Keys:
- Öffne die Google Cloud Console: console.cloud.google.com
- Gehe zu APIs & Services → Credentials
- Klicke zweimal auf „Create credentials → API key“
- Benenne die Keys sinnvoll, z. B.:
- Frymo Frontend Key
- Frymo Backend Key
Wann kann ich einen einzigen API-Key nutzen? #
Fall 1: Keine Anwendungseinschränkungen gesetzt #
Wenn dein API-Key keine Restriktionen unter „Application restrictions“ hat, kannst du:
→ denselben Key sowohl im Frontend- als auch im Backend-Feld in Frymo eintragen.
Die API-Keys funktionieren sofort, allerdings mit geringerer Sicherheit.
Fall 2: Du willst deinen Key absichern (empfohlen) #
Dann musst du zwei Keys getrennt absichern:
Frontend-Key · HTTP-Referrer-Restriction #
- Wähle unter „Application restriction“ → HTTP referrers (websites)
- Füge deine Domains hinzu:
- https://deinedomain.de/*
- https://www.deinedomain.de/*
- http://localhost/* (für lokale Entwicklung)
- Unter „API restrictions“ aktiviere:
- Maps JavaScript API
- Maps Embed API
Backend-Key · IP-Restriction #
- Wähle unter „Application restriction“ → IP addresses
- Trage deine Server-IP ein:
https://www.ip-von-domain.de/ - Unter „API restrictions“ aktiviere:
- Geocoding API
- Places API
API-Keys in Frymo eintragen #
- Öffne dein WordPress-Dashboard.
- Gehe zu Frymo → Einstellungen → Integrationen → Google API.
- Füge die Keys in die beiden Felder ein:
- Frontend-Key → Maps JavaScript API / Maps Embed API
- Backend-Key → Geocoding API / Places API
- Speichern.
Die Validierung zeigt dir danach:
- ✅ Grün: API funktioniert korrekt
- ⚠️ Gelb: API funktioniert, aber Restriktionen sind nicht optimal
- ❌ Rot: API ist blockiert oder nicht aktiviert
Preise & Freikontingente (Kurzüberblick) #
Google nutzt seit 2025 freie Kontingente pro API-SKU und ein Pay-as-you-go-Modell.
- Geocoding API: ca. 4–5 $ pro 1.000 Requests
- Places Autocomplete: ca. 2 $ pro 1.000 Requests
- Maps JavaScript API: ca. 7 $ pro 1.000 Map Loads
Für typische Immobilienseiten bleiben die Kosten meist nahe 0, da du häufig innerhalb der kostenlosen Kontingente bleibst.
Häufige Fehler & Lösungen #
Frontend funktioniert, Backend nicht #
- Backend-Key besitzt HTTP-Referrer statt IP-Restriction → korrigieren
- Server-IP nicht korrekt → mit ip-von-domain.de prüfen
Backend funktioniert, Karte lädt nicht #
- Frontend-Key hat IP-Restriction statt HTTP-Referrers gesetzt
- Domain falsch oder ohne /* eingetragen