Geolocation Addon

Möchtest du mehr über die Standorte der Nutzer erfahren, die deine Formulare ausfüllen? Mit dem WPForms Geolocation Addon kannst du ganz einfach geografische Daten für jeden deiner Leads sammeln.

Dieses Tutorial zeigt dir, wie du das Geolocation Addon für WPForms installierst und verwendest.

---

Einrichtung des Geolocation-Addons

Bevor du beginnst, musst du sicherstellen, dass WPForms auf deiner WordPress-Website installiert und aktiviert ist.

Sobald du WPForms installiert und deine Lizenz verifiziert hast, kannst du schnell das Geolocation Addon installieren und aktivieren.

Nachdem du das Addon aktiviert hast, kannst du seine Einstellungen konfigurieren, indem du zu WPForms » Einstellungen gehst und den Tab Geolocation auswählst.

Hier hast du die Möglichkeit zu wählen, von welchem Anbieter du deine Geolocation-Informationen erhalten möchtest.

In den folgenden Abschnitten behandeln wir die Einrichtung der Google Places und Mapbox Search APIs.

Google Places API

Wähle zuerst Google Places aus der Liste der Optionen im Abschnitt Geolocation.

Sobald du die Google Places-Option auswählst, werden zusätzliche Einstellungen angezeigt. Du musst deinen Google Places API-Schlüssel abrufen, damit du ihn in das bereitgestellte Feld eingeben kannst. Öffne dazu die Google Cloud Console in einem neuen Browser-Tab oder -Fenster.

Generieren deines Google Places API-Schlüssels

Wähle oben auf deinem Google Cloud-Dashboard das Projekt aus, für das du diesen API-Schlüssel aktivieren möchtest, über das Menü Projekt auswählen.

Wenn du noch kein Projekt erstellt hast, klicke auf NEUES PROJEKT, um eines einzurichten.

Sobald du dein Projekt geöffnet hast, solltest du zu dessen Dashboard für APIs & Dienste weitergeleitet werden. Wenn nicht, öffne das Hamburger-Menü in der oberen linken Ecke des Bildschirms und gehe zu APIs & Dienste » Aktivierte APIs & Dienste.

Klicke dann auf + APIS UND DIENSTE AKTIVIEREN.

Dies öffnet die API-Bibliothek. Suche nach den folgenden APIs und aktiviere sie:

• Places API
• Maps JavaScript API
• Geocoding API

Um eine API für Ihr Projekt zu aktivieren, müssen Sie nur auf die blaue Schaltfläche AKTIVIEREN unter ihrem Namen klicken.

Nachdem Sie alle drei APIs aktiviert haben, navigieren Sie zu den Credentials-Einstellungen, indem Sie im Menü auf der linken Seite zu APIs & Dienste » Anmeldedaten gehen. Klicken Sie von hier aus auf + ANMELDEINFORMATIONEN ERSTELLEN und wählen Sie die Option API-Schlüssel, um einen API-Schlüssel zu generieren.

Klicken Sie im Popup-Fenster mit Ihrem neuen API-Schlüssel auf API-Schlüssel bearbeiten.

Auf dem nächsten Bildschirm müssen Sie die folgenden Optionen konfigurieren:

Anwendungsbeschränkung festlegen

Damit Ihr API-Schlüssel mit WPForms verwendet werden kann, müssen Sie die Option Websites auswählen.

Website-Beschränkungen

Nachdem Sie die Verwendung Ihres Schlüssels auf Websites zugelassen haben, wird empfohlen, aus Sicherheitsgründen einzuschränken, welche Domains ihn verwenden dürfen. Klicken Sie dazu im Abschnitt Website-Beschränkungen auf + HINZUFÜGEN.

Geben Sie dann die Domain Ihrer Website in das vorgesehene Feld ein. Wenn Sie möchten, dass Ihr Schlüssel auf einer gesamten Domain verwendet werden kann, geben Sie ihn mit einem Schrägstrich (/) gefolgt von einem Sternchen (*) am Ende ein.

Sie können so viele Elemente hinzufügen, wie Sie benötigen, um Ihren Schlüssel für Ihre gesamte Website oder mehrere Websites zu aktivieren.

API-Beschränkungen

Nachdem Sie Ihren Schlüssel nach Anwendung und Website eingeschränkt haben, müssen Sie Ihren Schlüssel nach API einschränken. Wählen Sie dazu die Option Schlüssel einschränken.

Dadurch wird ein Dropdown-Menü angezeigt, aus dem Sie die spezifischen APIs auswählen müssen, auf die Sie Ihren Schlüssel einschränken möchten.

Wählen Sie aus diesem Dropdown-Menü die folgenden APIs aus:

• Places API
• Maps JavaScript API
• Geocoding API

Nachdem Sie diese APIs ausgewählt haben, klicken Sie auf die Schaltfläche Speichern, um Ihre Einstellungen zu speichern.

Kopieren Ihres Google Places API-Schlüssels

Nachdem Sie Ihre Einstellungen gespeichert haben, werden Sie zu einer Übersicht über alle Ihre verfügbaren API-Schlüssel weitergeleitet. Um Ihren Schlüssel anzuzeigen, klicken Sie unter der Überschrift Aktionen auf die Option SCHLÜSSEL ANZEIGEN.

Ein Popup-Fenster wird angezeigt, das den API-Schlüssel anzeigt. Kopieren Sie von hier aus den Schlüssel, indem Sie auf das Kopiersymbol klicken, und kehren Sie zu Ihren WPForms-Einstellungen zurück.

Fügen Sie in Ihren WPForms-Einstellungen den gerade kopierten API-Schlüssel in das Feld API-Schlüssel ein und speichern Sie Ihre Einstellungen.

Wenn Sie Ihre Formulare mit den Standorten der Benutzer vorab ausfüllen möchten, schalten Sie die Option Aktueller Standort auf EIN.

Das ist alles, was Sie wissen müssen, um die Google Places API einzurichten. Im nächsten Abschnitt behandeln wir die Verwendung des Mapbox-Providers, einer weiteren großartigen Option für Geolocation-Daten.

Mapbox Search API

Um die Mapbox Search API einzurichten, wählen Sie Mapbox Search aus der Liste der Optionen im Abschnitt Geolocation.

Sobald Sie die Mapbox Search API-Option auswählen, werden zusätzliche Einstellungen angezeigt. Sie müssen ein Mapbox Search-Zugriffstoken erstellen. Dazu müssen Sie sich zuerst in Ihrem Mapbox-Konto-Dashboard anmelden.

Sobald Sie auf Ihr Konto-Dashboard zugegriffen haben, suchen Sie die Navigationsleiste und klicken Sie auf Tokens.

Dadurch gelangen Sie zur Seite Zugriffs-Tokens, auf der Sie Ihre Tokens hinzufügen und verwalten können.

Mapbox stellt Ihnen ein Standard-Zugriffstoken zur Verfügung. Wir empfehlen jedoch, ein neues Token zu erstellen, das Sie speziell für WPForms verwenden können. Klicken Sie dazu auf die Schaltfläche Ein Token erstellen.

Wenn Sie auf diese Schaltfläche klicken, gelangen Sie zu einer neuen Seite, auf der Sie ein neues Zugriffstoken erstellen können. Suchen Sie im Abschnitt Token-Name das Feld Name und geben Sie eine Bezeichnung ein, um es einem Projekt zuzuordnen.

Scrollen Sie dann zum Abschnitt Token-Bereiche. Hier sehen Sie verschiedene öffentliche Bereiche, die standardmäßig ausgewählt sind. Lassen Sie diesen Abschnitt unverändert.

Scrollen Sie als Nächstes zum Abschnitt Token-Beschränkungen und geben Sie die URL Ihrer Website in das Feld URL ein.

Nachdem Sie Ihre URL eingegeben haben, klicken Sie auf die Schaltfläche URL hinzufügen, um die URL hinzuzufügen.

Sobald Sie die erforderlichen Felder ausgefüllt haben, klicken Sie auf die Schaltfläche Token erstellen.

Anschließend wird ein modales Fenster angezeigt, in dem Sie aufgefordert werden, Ihr Kontopasswort zu bestätigen. Geben Sie Ihr Passwort ein und klicken Sie auf Senden.

Nun werden Sie zurück zur Seite Zugriffs-Tokens weitergeleitet, wo Sie das gerade erstellte neue Token sehen. Klicken Sie auf das Kopiersymbol, um das Token zu kopieren.

Sobald Sie Ihr Zugriffstoken kopiert haben, kehren Sie zu Ihren WPForms-Einstellungen zurück und fügen Sie das Token in das Feld Zugriffstoken ein.

Wenn Sie Ihre Formulare mit den Standorten der Benutzer vorab ausfüllen möchten, aktivieren Sie die Option Aktueller Standort.

Wenn Sie fertig sind, stellen Sie sicher, dass Sie Ihre Einstellungen speichern.

Als Nächstes sehen Sie eine Kartenvorschau. Wenn Sie sich entschieden haben, Ihren Standort freizugeben, sehen Sie Ihren aktuellen Standort auf der Karte.

Im nächsten Abschnitt erfahren Sie, wie Sie Autovervollständigung für Adressen zu Ihren Formularen hinzufügen.

Adress-Autovervollständigung zu deinen Formularen hinzufügen

Nachdem Sie Ihre Geolocation-Einstellungen konfiguriert haben, können Sie die Autovervollständigungsfunktion des Geolocation-Addons in Ihren Formularen aktivieren.

Dazu müssen Sie zuerst ein neues Formular erstellen oder ein vorhandenes bearbeiten. Fügen Sie dann im Formular-Builder entweder ein Feld vom Typ Adresse oder ein Feld vom Typ Einzeiliger Text hinzu.

Wenn Sie die Adresse auf mehreren Zeilen anzeigen möchten, wählen Sie das Feld Adresse.

Wenn Sie die Adresse lieber auf einer einzigen Zeile anzeigen möchten, wählen Sie das Feld Einzeiliger Text.

Öffnen Sie dann das Bedienfeld für die Feldoptionen für Ihr Adress- oder einzeiliges Textfeld und klicken Sie auf die Registerkarte Erweitert, um zusätzliche Einstellungen zu öffnen. Von hier aus können Sie die Adress-Autovervollständigungsfunktion aktivieren, indem Sie die Option Adress-Autovervollständigung aktivieren auswählen.

Wenn Sie möchten, können Sie auch eine interaktive Karte auf dem Frontend Ihrer Website anzeigen, indem Sie die Option Karte anzeigen auswählen. Dies öffnet ein Dropdown-Menü, in dem Sie auswählen können, ob die Karte über oder unter dem Feld Ihres Formulars angezeigt werden soll.

Wenn Sie alles eingerichtet haben, vergessen Sie nicht, Ihr Formular zu speichern.

Hier ist ein Beispiel, wie Ihr Formular mit aktivierter Karten- und Adress-Autovervollständigungsoption im Frontend aussehen könnte:

Verwendung des Kartenfelds

Das Kartenfeld in WPForms ermöglicht es Ihnen, bestimmte Standorte auf einer interaktiven Karte innerhalb Ihrer Formulare anzuzeigen. Im Gegensatz zum Adressfeld, das den Standort von Benutzern sammelt, die Ihr Formular absenden, zeigt das Kartenfeld von Ihnen konfigurierte Standorte an, wie z. B. Geschäftsadressen, Ladenstandorte oder Abholpunkte. Diese Funktion ist ideal, um mehrere Geschäftsstandorte zu präsentieren oder Benutzern zu helfen, bestimmte Servicebereiche zu identifizieren.

Ausführliche Schritt-für-Schritt-Anleitungen zum Hinzufügen von Standorten, Anpassen von Markierungen, Konfigurieren von erweiterten Einstellungen und Verwalten mehrerer Standorte finden Sie in unserem umfassenden Leitfaden zur Verwendung des Kartenfelds in WPForms.

Standortdaten von Einträgen anzeigen

Um die Geolocation-Daten eines Eintrags anzuzeigen, gehen Sie zu WPForms » Einträge und wählen Sie das Formular aus, für das Sie Geolocation-Details anzeigen möchten. Klicken Sie dann auf Anzeigen, um die Seite eines einzelnen Eintrags zu öffnen.

Zusätzlich zu einer interaktiven Karte sehen Sie Details wie Stadt, Bundesland, Land und Postleitzahl des Benutzers sowie ungefähre Längen- und Breitengradkoordinaten für die Stadt des Benutzers.

Geolocation-Daten in Formular-Benachrichtigungs-E-Mails einfügen

Wenn Sie möchten, können Sie Geolocation-Daten auch in automatischen Benachrichtigungs-E-Mails für Ihre Formulare aufnehmen.

Um dies einzurichten, öffnen Sie den Formular-Builder und gehen Sie zu Einstellungen » Benachrichtigungen. Scrollen Sie dann zum Abschnitt E-Mail-Nachricht und fügen Sie das Smart Tag {entry_geolocation} hinzu.

Wenn die Benachrichtigungs-E-Mail gesendet wird, enthält sie Standortdaten für den Benutzer.

Das ist alles! Sie wissen jetzt, wie Sie Geolokationsdaten sammeln, um mehr über Ihre Benutzer zu erfahren.

Möchten Sie als Nächstes verschiedene Benachrichtigungs-E-Mails senden, abhängig von den Formularauswahlen der Benutzer? Um zu erfahren, wie das geht, lesen Sie unbedingt unser Tutorial zu bedingten Formularbenachrichtigungen.