Siehe auch “Send user inputs between forms in Fluent Forms” SnippetClub Article
Als Website-Betreiber weißt du, wie wichtig es ist, deinen Besuchern Formulare und Funnel bereitzustellen. Ob für die Anmeldung zu einem E-Mail-Verteiler, für Nachrichten eine einfache Kontaktformular oder den Download eines Freebies – Formulare bieten eine einfache Möglichkeit, Daten zu sammeln und mit Benutzern zu interagieren.
Dabei sollte es den Besuchern möglichst leicht gemacht werden, die Formularfelder auszufüllen, um Abbrüche beim Ausfüllen möglichst effektiv vorzubeugen.
Doch während es Newsletter-Anmeldungen, Kontaktformularen und Freebie-Downloads meistens integrierte Plugin-Lösungen gibt, sollen häufig auch externe Tools angebunden werden, z.B. für Terminbuchungen über calendly, harmonizely, hubspot, simplemeet und andere.
Das Problem: Doppelte Eingabeaufforderungen
tba
Die Lösung: URL-Parameter
Auf der Weiterleitungs-Site des Formulars können bei den meisten Formular-Plugins statt einer Bestätigungsnachricht auch auf externe Seiten nach dem Absenden umgeleitet werden.
Damit die Besucher dort kein zweites Mal ihre Daten angeben müssen, können die Daten aus den zuvor ausgefüllten Feldern über URL-Parameter übertragen werden, sodass die Felder auf der Zielseite automatisch vorausgefüllt werden.
Je nachdem, wie viele und welche Art von Feldern auf der Zielseite existieren, können die Daten auch verkettet werden, um z.B. die zuvor über zwei separate Vor- und Nachname-Felder erhobenen Daten in einem einzigen Namens-Feld zusammenzufassen.
Beispiel Fluent Forms an Calendly
Wenn die Felder Vorname & Nachname in FluentForms “Sascha” & “Liem“, das E-Mail-Feld “sl@iwell.de” enthalten, dann würden diese Daten folgendermaßen übermittelt werden:
https://calendly.com/mein-business/mein-termin?first_name=Sascha&last_name=Liem&email=sl@iwell.de
Um dies zu ermöglichen, müssen im Weiterleitungsfeld im Formular diese Werte ausgelesen werden. FluentForms bietet hierfür eine bequeme Möglichkeit, diese Felder in die Weiterleitungs-URL einzufügen, nämlich über die 3 Punkte am rechten Rand des Feldes. So sieht dann hier die URL aus:
https://calendly.com/mein-business/mein-termin?first_name={inputs.names.first_name}&last_name={inputs.names.last_name}&email={inputs.email}
Beispiel Fluent Forms an Harmonizely / SimpleMeet.me
Die zuvor angesprochene Situation, dass auf der Buchungsseite nur ein einziges Namensfeld besteht, kann gelöst werden, indem die Daten zusammengefasst mit einem Leerzeichen dazwischen übertragen werden.
Um ein Leerzeichen in die URL aufzunehmen, müssen Sie es als “%20” kodieren. Dies ist die URL-Kodierung für ein Leerzeichen. Wenn also einer Ihrer Parameter ein Leerzeichen enthält, können Sie es wie folgt in die URL aufnehmen:
https://harmonizely.com/mein-business/mein-termin?name=Vorname%20Nachname&email=Email
Hier würde die URL in FluentForms folgendermaßen aussehen:
https://harmonizely.com/mein-business/mein-termin?name={inputs.names.first_name}%20{inputs.names.last_name}&email={inputs.email}