Erstellen Sie schöne WordPress-Websites mit Divi und Divi Builder

So fügen Sie automatisch vervollständige Adressformulare in WordPress hinzu

Muneeb WordPress-Tutorials Oct 21, 2021

Die automatische Vervollständigung von Adressformularen ist eine großartige zeitsparende Taktik. Je nahtloser und schneller Ihre Website die Arbeit des Kunden erledigen muss, desto größer ist die Wahrscheinlichkeit, dass er auf Ihre Website zurückkehrt.

Autocomplete-Adressformulare verwenden Google-Standorte, um die Adresse vorzuschlagen, wenn die Benutzer ihre Adresse in das Formular eingeben. In diesem Artikel werden wir verstehen, wie Sie mit WP Forms automatisch Adressformulare in WordPress erstellen.

So erstellen Sie automatisch vervollständige Adressformulare

WordPress ist standardmäßig nicht mit Autocomplete-Adressformularen ausgestattet, weshalb wir das WP Forms-Plugin benötigen.

WP Forms ist das beliebteste und eines der besten Formularerstellungs-Plugins auf dem Markt. Mit WP Forms können Sie erstaunlich kreative und interessante Formulare für Ihre Website erstellen.

Divi herunterladen Das beste WordPress-Thema

Das beliebteste WordPress-Thema der Welt und der ultimative Wordpress-Seite-Builder

Divi herunterladen.

Außerdem ist es für Anfänger recht einfach zu bedienen und daher benötigen Sie keine hervorragenden Programmierkenntnisse, um die Benutzererfahrung Ihrer Website zu verbessern.

Sobald Sie das WP Forms-Plugin installiert und aktiviert haben, werden Sie nach dem Lizenzschlüssel gefragt, um Ihr Abonnement zu überprüfen.

Drücken Sie Verify Key, nachdem Sie mit der Eingabe des Lizenzschlüssels fertig sind, und fahren Sie fort.

Klicken Sie in Ihrem WordPress-Dashboard auf die Schaltfläche Addons direkt unter der Option WP Forms .

Suchen Sie in der Suchleiste nach GeoLocation Addon und installieren Sie das Addon.

Dieses Add-on schlägt Ihren Benutzern Adressen vor, wenn sie beginnen, ihre Adressdaten hinzuzufügen.

Als nächstes müssen Sie zu den WP Forms- Einstellungen gehen und dann die Registerkarte Geolocation auswählen. Aktivieren Sie die Google Places-API und den aktuellen Standort .

Rufen Sie als Nächstes die Google Cloud Platform auf, um den API-Schlüssel für Google Places abzurufen. Drücken Sie auf dieser Seite auf APIs und Dienste aktivieren .

Es zeigt die gesamte Liste der APIs an, während Sie nur die Google Places API, die Google Maps JavaScript API und die Geocoding API aktivieren müssen .

Als nächstes müssen Sie zu den APIs und Diensten wechseln und dann zur Seite " Anmeldeinformationen" gehen. Drücken Sie oben auf der Seite die Schaltfläche +Create Credentials und generieren Sie den API-Schlüssel

Ein neu generierter Schlüssel wird ausgegeben und Sie können die Verwendung des Schlüssels auch durch Drücken der Schaltfläche Schlüssel einschränken steuern.

Aktivieren Sie die Option HTTP-Referrer (Website) auf der Seite API-Schlüssel einschränken und umbenennen .

Markieren Sie abschließend die Option Schlüssel einschränken und wählen Sie die zuvor ausgewählten APIs aus der Dropdown-Liste aus.

Nach dem Speichern ist Ihr API-Schlüssel bereit, den Sie von dieser Seite kopieren können.

Fügen Sie auf der Seite mit den Geolocation- Einstellungen die API ein. Sie können die Seite über den WordPress-Adminbereich aufrufen.

Nachdem Sie alle Einstellungen vorgenommen haben, können Sie ein neues Adressformular erstellen.

So erstellen Sie ein Kontaktformular auf WordPress

Gehen Sie im WordPress-Dashboard zu WP Forms und klicken Sie auf Neu hinzufügen. Sie gelangen dann zur Formularerstellungsseite. Geben Sie zunächst den Namen Ihres Formulars ein und wählen Sie die Vorlage für Ihr Formular aus.

Die Vorlage wird gestartet und alle Felder für Ihr Formular befinden sich auf der linken Seite, während sich die Vorschau auf der rechten Seite befindet. Sie können die Felder von links nach rechts ziehen und ablegen, um alle gewünschten Änderungen vorzunehmen. Ziehen Sie aus Fancy Fields das Adressfeld nach rechts und legen Sie es dort ab.

Drücken Sie als Nächstes in der Vorschau auf das Adressfeld, um die Bearbeitungsoptionen zu aktivieren. Gehen Sie zu den erweiterten Optionen und aktivieren Sie die automatische Adressvervollständigung .

Der letzte Schritt besteht darin, dieses Formular zu Ihrer Website hinzuzufügen. Zuerst müssen Sie eine neue Seite hinzufügen und diese entsprechend benennen. Dann müssen Sie einen WP Forms-Block zu Ihrer Seite machen.

Nach dem Hinzufügen können Sie aus der Dropdown-Liste das zuvor erstellte Formular auswählen.

Veröffentlichen Sie schließlich Ihre Seite und überprüfen Sie Ihre Website, um zu sehen, ob sie perfekt funktioniert.

So können Sie in WordPress mit WP Forms ein Adressformular mit automatischer Vervollständigung erstellen. Das ist alles von uns für dieses Tutorial. Folgen Sie uns auf Facebook und Twitter.