So aktivieren Sie die Einstellung "Vorausfüllen über URL" in WPForms

Möchten Sie die Benutzererfahrung auf Ihrer Website mit der WPForms-Einstellung Vorausfüllen per URL aktivieren optimieren? Formularfelder basierend auf früheren Interaktionen vorausfüllen? Die Nutzung von Abfragezeichenfolgen (Query Strings) zum automatischen Ausfüllen von Formularfeldern von einem Formular zum anderen kann den Benutzerkomfort und die Effizienz erheblich steigern.

Stellen Sie sich ein Szenario vor, in dem ein Benutzer bereits bestimmte Informationen in einem Formular angegeben hat und Sie diese Daten nahtlos in ein anderes Formular übertragen möchten, ohne dass er sie erneut eingeben muss. Durch die Verwendung von Abfragezeichenfolgen können Sie genau das erreichen und so eine reibungslosere und persönlichere Reise für Ihre Besucher gestalten.

Für eine Schritt-für-Schritt-Anleitung dieser Funktionalität in Aktion, die die Erstellung der 2 Formulare und die Übergabe von Informationen von einem Formular zum anderen beinhaltet, sehen Sie sich diesen Artikel an.

In diesem Tutorial konzentrieren wir uns mehr auf die Erklärung der Feldtypen und wie diese in Abfragezeichenfolgen aussehen, um Sie in die Lage zu versetzen, Ihre vorausgefüllten Formulare zu erstellen.

Vorausfüllen per URL aktivieren

Bevor wir mit dem Vorausfüllen unserer Formularfelder beginnen können, müssen wir diese Option zuerst in unserem Formular aktivieren, um diese vorausgefüllten Parameter von einem anderen Formular zu akzeptieren.

Um dies zu erreichen, müssen Sie zuerst ein neues Formular erstellen oder eines Ihrer Formulare bearbeiten. Navigieren Sie dann im Formular-Generator zu Einstellungen » Allgemein und aktivieren Sie in den Erweiterten Optionen die Option Vorausfüllen per URL aktivieren.

Einstellung „Prefill By URL aktivieren“ auf der Registerkarte „Allgemein“ der Einstellungen des Formulars unter den erweiterten Optionen

Zusammenstellen der URL

Als Nächstes müssen Sie eine URL mit einer Abfragezeichenfolge erstellen, die GET-Parameter verwendet, um ein bestimmtes Feld zu identifizieren und den entsprechenden Wert einzuschließen. Interessanterweise spielt der Feldtyp bei diesem Vorgang keine Rolle. Unabhängig vom Feldtyp folgen alle Abfragezeichenfolgen zum Aktivieren des Vorausfüllens per URL in WPForms einer konsistenten Struktur. Betrachten Sie zum Beispiel die folgende URL mit dem grundlegenden Format der Abfragezeichenfolge:

http://test.com?wpf20_1_subfield=value

  • ?wpf: Markiert den Beginn einer Abfragezeichenfolge für die Einstellung „Vorausfüllen per URL“ von WPForms.
  • Formular-ID: Identifiziert das Zielformular (in der bereitgestellten URL ist die Formular-ID 20).
  • Feld-ID: Gibt das beabsichtigte Feld im Formular an (in der gegebenen URL ist die Feld-ID 1).
  • Unterfeld-Identifikator (Optional): Wird nur verwendet, wenn ein Unterfeld angesprochen wird, wie z. B. das Stadt-Unterfeld in einem Adressfeld (in der Beispiel-URL wird es einfach als „subfield“ bezeichnet).
  • = (Gleichheitszeichen): Signalisiert den Beginn des Werts.
  • Wert: Stellt den gewünschten Wert dar, der für ein Feld hinzugefügt oder ausgewählt werden soll. Leerzeichen sollten durch %20 ersetzt werden.

Verwendung der Vorausfüll-Einstellung

In dem Tutorial-Link oben ist die Idee, dass Ihr Besucher das erste Formular sieht und einige grundlegende Informationen eingibt. Diese Informationen werden dann mit der Schaltfläche Senden an ein anderes Formular übergeben.

Um dies zu erreichen, gehen Sie im Formular-Generator zu Einstellungen » Bestätigungen. Wählen Sie dann im Dropdown-Menü Bestätigungstyp die Option URL aufrufen (Weiterleitung) aus. Fügen Sie dann die entsprechende wpf{formID}_{fieldID}-Abfragezeichenfolge zur Weiterleitungs-URL hinzu (siehe Beispiele unten).

Verwenden der Einstellung "Vorausfüllen per URL aktivieren", um eine Abfragestruktur zu füllen

Ein Beispiel ist das Hinzufügen dieser URL zur Bestätigungs-Weiterleitungs-URL. http://meinedomain.com/kontakt?wpf20_1=Events%20und%20Partys

In diesem Beispiel ist 20 die Formular-ID und 1 die Feld-ID. Die Abfragezeichenfolge muss sich auf die Formular- und Feld-ID im Format wpf{formID}_{fieldID} beziehen, damit das Feld vorausgefüllt wird (benutzerdefinierte Abfrage-Schlüssel wie kontakt-grund füllen WPForms-Felder nicht aus).

Bedingte Logik mit dieser Einstellung verwenden

Wenn bedingte Logik zusammen mit der Vorausfüll-Einstellung verwendet wird, funktioniert die Funktionalität nahtlos. Bedingte Felder werden weiterhin basierend auf den über die Vorausfüllung ausgefüllten Werten ein- oder ausgeblendet. Es ist wichtig zu beachten, dass die bedingte Logik angewendet wird, nachdem die Felder dynamisch ausgefüllt wurden, um sicherzustellen, dass Ihre Formulare weiterhin wie erwartet funktionieren.

Beispiele für Abfragezeichenfolgen für bestimmte Felder

Für fortgeschrittenere Benutzer bietet die folgende Tabelle Beispiele, die veranschaulichen, wie GET-Parameter für jeden Feldtyp konfiguriert werden. Wenn ein Feld verschiedene Formatierungsoptionen bietet, sind auch spezifische Beispiele für diese Alternativen enthalten.

Einzeiliger Text
Feldformat / Variationen GET-Parameter
?wpf771_1=text%20beliebiger%20länge
Absatz
Feldformat / Variationen GET-Parameter
?wpf771_2=text%20beliebiger%20länge
Feldformat / Variationen GET-Parameter
?wpf771_3=Zweite%20Wahl
Werte anzeigen aktiviert ?wpf771_4=dropdown1
Dynamische Auswahlmöglichkeiten: Beitragstyp ?wpf771_5=123
(123 ist die Beitragstyp-ID)
Dynamische Auswahlmöglichkeiten: Taxonomie ?wpf771_6=12
(12 ist die Taxonomie-ID)
Pipe-separated value (PSV) ?wpf135_3={field_id="9|value_choice"}
Mehrfachauswahl
Feldformat / Variationen GET-Parameter
?wpf771_7=Zweite%20Wahl
Werte anzeigen aktiviert ?wpf771_8=choice2
Bildauswahl ?wpf771_9=Zweite%20Wahl
?wpf771_9=choice2
(Abhängig von der Option Werte anzeigen)
Dynamische Auswahlmöglichkeiten: Beitragstyp ?wpf771_10=123
(123 ist die Beitragstyp-ID)
Dynamische Auswahlmöglichkeiten: Taxonomie ?wpf771_11=12
(12 ist die Taxonomie-ID)
Pipe-separated value (PSV) ?wpf135_3={field_id="9|value_choice"}
Kontrollkästchen
Feldformat / Variationen GET-Parameter
?wpf771_12=Zweite%20Wahl
?wpf771_12[]=Zweite%20Wahl
?wpf771_12[]=Zweite%20Wahl&wpf771_12[]=Dritte%20Wahl
Werte anzeigen aktiviert ?wpf771_13=checkbox2
Bildauswahl ?wpf771_14=Second%20Choice
?wpf771_14=checkbox2
?wpf771_14[]=Second%20Choice&wpf771_14[]=Third%20Choice
(Abhängig von der Option Werte anzeigen)
Dynamische Auswahlmöglichkeiten: Beitragstyp ?wpf771_15=123
?wpf771_15[]=124
(123 ist die Beitragsart-ID)
Dynamische Auswahlmöglichkeiten: Taxonomie ?wpf771_16=12
?wpf771_16[]=13
(12 ist die Taxonomie-ID)
Pipe-separated value (PSV) ?wpf135_3={field_id="9|value_choice"}
Zahlen
Feldformat / Variationen GET-Parameter
?wpf771_17=2018
Name
Feldformat / Variationen GET-Parameter
Einfach ?wpf771_18=name
Vorname Nachname ?wpf771_18_first=Vorname&wpf771_18_last=Nachname
Vorname Zweiter Vorname Nachname ?wpf771_19_first=Vorname&wpf771_19_last=Nachname&wpf771_19_middle=Zweitname
E-Mail
Feldformat / Variationen GET-Parameter
[email protected]
Bestätigung aktiviert [email protected]
DSGVO-Zustimmung
Feldformat / Variationen GET-Parameter
Nicht unterstützt.
Der Benutzer muss auf die Checkbox klicken, um zuzustimmen.
Website / URL
Feldformat / Variationen GET-Parameter
?wpf771_23=https://google.com
Einige Server blockieren möglicherweise Anfragen, die eine URL als Parameter enthalten. Testen Sie es unbedingt!
Adresse
Feldformat / Variationen GET-Parameter
USA ?wpf771_24_address1=Adresszeile%201&wpf771_24_address2=Adresszeile%202&wpf771_24_city=Del%20Mar&wpf771_24_state=CA&wpf771_24_postal=12345
International ?wpf771_25_address1=Adresszeile%201&wpf771_25_address2=Adresszeile%202&wpf771_25_city=Kharkiv&wpf771_25_state=Kharkiv Oblast&wpf771_25_postal=61000&wpf771_25_country=Ukraine
Passwort
Feldformat / Variationen GET-Parameter
Nicht unterstützt.
Der Benutzer muss Werte manuell eingeben.
Telefon
Feldformat / Variationen GET-Parameter
US/International ?wpf771_27=5555551234
Datum / Uhrzeit
Feldformat / Variationen GET-Parameter
Format: Datum, Typ: Datumsauswahl ?wpf771_28_date=22.11.2018
Datum, Typ: Datums-Dropdown (Unterfeld) ?wpf771_29_date_m=11&wpf771_29_date_d=22&wpf771_29_date_y=2018
Uhrzeit, Format: 12 H (Unterfeld) ?wpf771_30_time=06:00
Uhrzeit, Format: 12 H (Unterfeld) ?wpf771_31_time=13:00
Format: Datum-Uhrzeit ?wpf771_32_date=22.11.2018&wpf771_32_time=13:15
?wpf771_32_date_m=11&wpf771_32_date_d=22&wpf771_32_date_y=2018&wpf771_32_time=06:30
Versteckt
Feldformat / Variationen GET-Parameter
?wpf771_33=hidden%20value
HTML
Feldformat / Variationen GET-Parameter
Nicht unterstützt.
Dieses Feld ist nicht vom Benutzer editierbar.
Datei-Upload
Feldformat / Variationen GET-Parameter
Nicht unterstützt.
Sicherheitsmaßnahmen.
Seitenumbruch
Feldformat / Variationen GET-Parameter
Nicht unterstützt.
Dieses Feld ist nicht vom Benutzer editierbar.
Abschnittstrenner
Feldformat / Variationen GET-Parameter
Nicht unterstützt.
Dieses Feld ist nicht vom Benutzer editierbar.
Bewertung
Feldformat / Variationen GET-Parameter
?wpf771_38=4
Hebt 4/5 oder 4/10 hervor, abhängig von der Bewertungsskala.  Ein Beispiel wäre 4/3.
Captcha
Feldformat / Variationen GET-Parameter
Nicht unterstützt.
Der Benutzer sollte das Captcha manuell ausfüllen (Mathematik oder Frage und Antwort).
Unterschrift
Feldformat / Variationen GET-Parameter
Nicht unterstützt.
Der Benutzer sollte manuell unterschreiben.
Likert-Skala
Feldformat / Variationen GET-Parameter
?wpf771_41_r2_c1=1
?wpf771_41r1_c2[]=1&wpf771_41_r3_c1[]=1
r1 zeigt die erste Zeile an, c2 die zweite Spalte usw.
Unterstützt einzelne/mehrere Zeilen-Bewertungsskalen & mehrere Antworten.
Net Promoter Score
Feldformat / Variationen GET-Parameter
?wpf771_42=4
Wählt den Wert 4 von 0 bis 10 aus.
Zahlungsgutschein
Feldformat / Variationen GET-Parameter
?wpf771_1=Gutscheincode
Einzelner Artikel
Feldformat / Variationen GET-Parameter
?wpf771_43=10
Unterstützt nur den Elementtyp „Vom Benutzer definiert“.
Mehrere Artikel
Feldformat / Variationen GET-Parameter
?wpf771_44=Zweites%20Element
(Text- und Bildauswahl)
Feldformat / Variationen GET-Parameter
?wpf771_45=Zweites%20Element
Kreditkarte
Feldformat / Variationen GET-Parameter
Nicht unterstützt.
Der Benutzer sollte die Kreditkartendaten manuell eingeben.
Gesamt
Feldformat / Variationen GET-Parameter
Nicht unterstützt.
Der Wert wird beim Laden der Seite mit JavaScript berechnet.
Zahlungsfelder (Kontrollkästchen, mehrere Elemente, Dropdown-Elemente) mit Mengen
Feldformat / Variationen GET-Parameter
Standard ?wpf938_7={field_id="8|value_choice"}
Mit Mengen ?wpf938_7={field_id="8|value_choice"}&wpq938_7={field_id="8|quantity"}

Referenzartikel

  • Details zum Auffinden einer Formular-ID oder Feld-ID finden Sie in unserem Tutorial.
  • Als allgemeine Regel gilt, dass die maximale Länge für eine URL 2.000 Zeichen beträgt.

FAQ

F: Wie verwende ich dies für Unterbeschriftungen?

A: Wenn Sie dies zur Vorabfüllung eines Namens- oder Adressfelds verwenden, das mehrere Unterfelder haben könnte, möchten wir Ihnen ein Beispiel zeigen.

?wpf1036_1|first={field_id="1|first"}&wpf1036_1|last={field_id="1|last"}&wpf1036_3|address1={field_id="3|address1"}&wpf1036_3|address2={field_id="3|address2"}&wpf1036_3|city={field_id="3|city"}&wpf1036_3|state={field_id="3|state"}&wpf1036_3|postal={field_id="3|postal"}

Und das ist alles! Ein weiteres spezifisches Beispiel hierfür finden Sie in diesem Tutorial unter Verwendung von Abfragezeichenfolgen zur Vorabfüllung von Formularfeldern aus einem anderen Formular. Weitere Beispiele finden Sie in unserem Artikel Verwendung von Abfragezeichenfolgen zum automatischen Ausfüllen eines Textfelds.