Vorschau eines Formulareintrags vor dem Absenden

Möchten Sie, dass Ihre Besucher eine Vorschau ihrer Formulareingaben sehen können, bevor sie sie abschicken?

Die Möglichkeit, eine Vorschau der Eingaben anzuzeigen, verringert die Wahrscheinlichkeit von Fehlern und Ungenauigkeiten beim Ausfüllen der Formulare erheblich.

WPForms verfügt über ein Feld für die Eintragsvorschau, das Sie ganz einfach zu Ihren Formularen hinzufügen können, damit Ihre Benutzer während und nach dem Absenden eine schnelle Zusammenfassung ihrer Einträge sehen können.

In diesem Beitrag zeigen wir Ihnen, wie Sie das Feld Eintragsvorschau hinzufügen und es auf verschiedene Weise in WPForms anpassen können.

Jetzt ein Formular mit Eingabevorschau erstellen

Vorschau eines Formulareintrags vor dem Absenden

In unserem Tutorial erfahren Sie Schritt für Schritt, wie Sie Ihren Formularen eine Sendevorschau hinzufügen können.

Fangen wir an.

1. WPForms installieren

Um zu beginnen, wählen Sie einen geeigneten WPForms Plan und registrieren Sie Ihr Konto. Dann melden Sie sich in Ihrem WPForms-Konto Bereich und klicken Sie auf die Registerkarte Downloads. Dies wird eine Seite öffnen, wo Sie klicken Sie auf Download WPForms Taste, um die Zip-Datei herunterladen.

Wenn Sie auf dieser Seite sind, stellen Sie sicher, dass Sie Ihren Lizenzschlüssel kopieren. Sie benötigen diesen später, wenn Sie WPForms Pro auf Ihrer WordPress-Website aktivieren.

Nachdem die Zip-Datei auf Ihren Computer heruntergeladen wurde, öffnen Sie Ihr WordPress-Admin-Dashboard und klicken Sie auf Plugins " Neu hinzufügen. Klicken Sie dann auf die Schaltfläche Plugin hochladen.

Klicken Sie nun auf die Schaltfläche Datei auswählen und wählen Sie die Plugin-Datei aus, die Sie gerade heruntergeladen haben.

Klicken Sie auf Jetzt installieren, wenn die Datei hochgeladen ist.

WPForms wird nun auf Ihrer WordPress-Website installiert. Dies sollte nur ein paar Sekunden dauern. Wenn die Installation abgeschlossen ist, klicken Sie auf die Schaltfläche " Plugin aktivieren".

Klicken Sie nun auf WPForms " Einstellungen. Daraufhin wird standardmäßig die Registerkarte "Allgemeine Einstellungen" geöffnet. Scrollen Sie nach unten, um das Feld Lizenzschlüssel zu finden, und geben Sie hier Ihren Schlüssel ein (den Sie zuvor kopiert haben).

Klicken Sie dann auf die Schaltfläche Schlüssel überprüfen. Dies wird Ihre WPForms Pro Installation auf Ihrer Website abzuschließen.

2. Ein neues Formular hinzufügen

Öffnen Sie nun den WordPress-Verwaltungsbereich Ihrer Website und klicken Sie in der linken Seitenleiste auf WPForms " Add New . Sie können Ihrem Formular nun einen Namen geben, damit Sie es später leicht wiederfinden.

Scrollen Sie nach unten, um eine Vorlage auszuwählen und mit der Erstellung Ihres Formulars zu beginnen. Wie alle WPForms-Felder wird das Feld Eintragsvorschau von den meisten der über 2.000 verfügbaren Formularvorlagen unterstützt.

Wenn Sie eine Vorlage ausgewählt haben, fügen wir im nächsten Schritt das Feld Eintragsvorschau hinzu.

3. Hinzufügen des Feldes für die Formulareingabevorschau

Im folgenden Beispiel verwenden wir ein benutzerdefiniertes Terminbuchungsformular, aber Sie können jede beliebige Formularvorlage Ihrer Wahl verwenden.

Um eine Vorschaufunktion zu Ihrem Formular hinzuzufügen, ziehen Sie einfach das Feld Eintragsvorschau aus dem linken Bereich des Formularerstellers in den rechten Bereich, in dem sich Ihre eigentlichen Formularfelder befinden.

Wenn Sie das Feld Eintragsvorschau zu Ihrem Formular hinzufügen, wird automatisch eine neue Seite hinzugefügt, auf der die Vorschau angezeigt wird.

So sieht die Vorschau in Aktion aus, wenn ein Benutzer ein Formular ausfüllt:

Sie können das Feld Eintragsvorschau auch mehrfach in Ihrem Formular platzieren. Wenn Sie z. B. ein mehrseitiges Formular haben, können Sie nach jeder Seite ein Eingabevorschau-Feld einfügen. Das bedeutet, dass Ihre Benutzer eine Vorschau der Informationen sehen können, die sie auf den vorherigen Seiten ausgefüllt haben, während sie mit dem Ausfüllen des restlichen Formulars fortfahren.

Durch das Hinzufügen mehrerer Eingabevorschaufelder in Ihren langen Formularen können Sie sicherstellen, dass Ihre Benutzer eine Vorschau ihrer Eingaben sehen und bei Bedarf jederzeit zurückgehen können, um Änderungen vorzunehmen.

4. Hinweis und Stil der Vorschau anpassen

WPForms ermöglicht es Ihnen, die Vorschau Hinweis anpassen. Klicken Sie einfach auf das Feld Eintragsvorschau in Ihrer Formularerstellungsansicht, um die Feldeinstellungen zu öffnen.

Mit der Schaltfläche Vorschauhinweis anzeigen können Sie die Meldung über der Eintragsvorschau anzeigen oder ganz ausblenden.

Außerdem haben Sie die Möglichkeit, die Vorschaumeldung nach Ihren Wünschen zu bearbeiten oder die Standardmeldung unverändert zu lassen.

Als Nächstes möchten Sie vielleicht den Stil der Eintragsvorschau ändern. Klicken Sie auf die Registerkarte Erweitert in den Optionen des Feldes Eintragsvorschau, um aus 4 verschiedenen Vorschaustilen zu wählen:

• Grundlegend
• Kompakt
• Tabelle
• Tisch, Kompakt

Der Standardstil ist Basic, der eine zeilenweise Vorschau des Formulareintrags anzeigt.

Wenn Sie Ihrer Vorschau ein strafferes Aussehen verleihen möchten, können Sie sich für die Option Kompakt entscheiden.

Damit ist die Einrichtung des Feldes Eintragsvorschau in Ihren Formularen abgeschlossen. Aber es gibt noch eine weitere Art von Eintragsvorschau, die Sie hinzufügen können, wie wir im nächsten Schritt zeigen.

5. Eintrag hinzufügen Vorschau-Bestätigung

Neben der Eingabevorschau, die beim Ausfüllen eines Formulars erscheint, können Sie mit WPForms auch eine Vorschau anzeigen , nachdem ein Benutzer ein Formular abgeschickt hat.

Im Gegensatz zum Feld Eintragsvorschau können Ihre Benutzer ihre Einträge nicht mehr ändern, wenn eine Vorschau-Bestätigung angezeigt wird. Stattdessen wird Ihren Nutzern nur eine Kopie ihrer Eingabe angezeigt, die nicht mehr geändert werden kann.

Um Eintragsvorschau-Bestätigungen einzurichten, gehen Sie im WPForms Form Builder zu Einstellungen " Bestätigungen. Hier können Sie die Schaltfläche Eintragsvorschau nach der Bestätigungsnachricht anzeigen einschalten.

Wenn Sie diese Option aktiviert haben, erscheint ein Dropdown-Menü, aus dem Sie einen Vorschaustil auswählen können, wie wir es oben für die Eingabevorschau-Felder gezeigt haben.

Sie können weiterhin die Eintragsvorschau (die beim Ausfüllen eines Formulars erscheint) und die Vorschau-Bestätigung (die erst nach dem Absenden der Einträge erscheint) verwenden. Oder Sie können nur die eine oder die andere Option verwenden. Das hängt ganz von Ihren Präferenzen ab und davon, was Sie mit Ihren Formularen erreichen wollen.

Und das war's! Jetzt können Sie Ihren Nutzern erlauben, einen Formulareintrag in der Vorschau zu sehen, bevor sie ihn absenden.

Warum sollten Sie eine Eintragsvorschau anzeigen?

Die Möglichkeit, Einträge in der Vorschau anzuzeigen, ist sehr nützlich, insbesondere bei längeren und komplexeren Formularen.

Es ist normal, dass man sich beim Ausfüllen eines Formulars vertippt und Fehler macht, aber eine Vorschau vor dem Absenden ermöglicht es Ihnen, die Informationen auf Richtigkeit zu überprüfen, bevor Sie auf die Schaltfläche "Absenden" drücken.

Wenn Sie also Fehler minimieren und Ihren Benutzern die Möglichkeit geben wollen, eventuelle Fehler vor dem Absenden zu korrigieren, sollten Sie das von WPForms angebotene Eingabevorschau-Feld einbeziehen.

Als nächstes erzwingen Sie Zugriffsbeschränkungen für WordPress-Formulare

Möchten Sie Ihre WordPress-Formulare nur auf angemeldete Benutzer beschränken? Mit WPForms können Sie die Berechtigungsstufen der Benutzer nach ihrem Anmeldestatus auswählen. Lesen Sie unseren Artikel über die Beschränkung von WordPress-Formularen auf eingeloggte Benutzer, um mehr zu erfahren.

Vielleicht möchten Sie auch unseren Leitfaden über die besten WordPress-Benachrichtigungsleisten-Plugins lesen, um Ihre Verkäufe und Sonderangebote auf Ihrer Website zu fördern.

Jetzt ein Formular mit Eingabevorschau erstellen

Sind Sie bereit, Ihr Formular zu erstellen? Starten Sie noch heute mit dem einfachsten WordPress-Formularerstellungs-Plugin. WPForms Pro enthält viele kostenlose Vorlagen und bietet eine 14-tägige Geld-zurück-Garantie.

Wenn dieser Artikel Ihnen geholfen hat, folgen Sie uns bitte auf Facebook und Twitter für weitere kostenlose WordPress-Tutorials und -Anleitungen.