Haben Sie sich schon einmal gefragt, wie Sie mit einem mehrstufigen Elementor-Formular das Engagement der Nutzer und die Leadgenerierung auf Ihrer Website steigern können?
Diese Formulare führen die Nutzer Schritt für Schritt durch den Prozess und machen ihn so weniger überwältigend und benutzerfreundlicher.
WPForms ist mit Elementor integriert, um Ihnen alle Möglichkeiten eines Page Builders in Kombination mit der Vielseitigkeit des besten Form Builders zu bieten. Ich werde Sie durch die Grundlagen der Einrichtung eines mehrstufigen Formulars in Elementor in ein paar einfachen Schritten gehen.
Erstellen Sie Ihr mehrstufiges Elementor-Formular
1. Installieren Sie das WPForms Plugin
WPForms ist eine führende Wahl für die Erstellung mehrstufiger Formulare. Es verfügt über mehr als 2.000 gebrauchsfertige Vorlagen, die für verschiedene Online-Geschäftsanforderungen geeignet sind und die Interaktion mit dem Benutzer verbessern.
Für dieses Tutorial ist es unerlässlich, die WPForms Pro Lizenz zu besitzen. Sie ist vollgepackt mit Funktionen wie dem Lead Forms Addon, erweiterten Integrationen und mehr, die für die Erstellung eines mehrstufigen Formulars in Elementor entscheidend sind.
Sobald Sie die Pro-Lizenz erworben haben, ist die Installation und Aktivierung von WPForms auf Ihrer Website ganz einfach. Zur Unterstützung finden Sie hier eine einfache Anleitung zur Installation eines WordPress-Plugins.
2. Aktivieren Sie das Lead Forms Addon
Wir werden das Lead Forms Addon verwenden, um das mehrstufige Formular zu erstellen. Ich liebe die Art und Weise, wie dieses Addon ein normales Formular in ein modernes, attraktives mehrstufiges Layout umwandelt.
Die Installation des Lead Forms Addons ist sehr einfach. Gehen Sie in Ihrem WordPress-Dashboard zu WPForms und klicken Sie dann auf Addons.
Suchen Sie anschließend im Bereich Addons suchen nach "Lead Forms". Klicken Sie dann auf Addon installieren und anschließend auf die Schaltfläche Aktivieren.
Dieser Schritt bereitet Sie auf die Erstellung eines benutzerdefinierten Elementor Multi-Step-Formulars auf Ihrer Website vor, um die Benutzerinteraktion zu verbessern.
3. Wählen Sie das Elementor Multi-Step Template
Lassen Sie uns nun Ihre mehrstufigen Elementor-Formularfelder erstellen. Gehen Sie in Ihrem WordPress-Dashboard zu WPForms und klicken Sie auf Add New.
Benennen Sie Ihr Formular auf der nächsten Seite. Für den Zweck dieses Tutorials nennen wir unser Formular "Elementor Multi-Step Form".
Verwenden Sie anschließend das Suchfeld, um die Elementor Multi-Step Form Template zu finden. Klicken Sie dann auf die Schaltfläche Vorlage verwenden.
Sie werden nun zum Abschnitt Felder im Formularerstellungsbildschirm weitergeleitet. Hier sind die verfügbaren Felder auf der linken Seite aufgelistet.
Auf der rechten Seite des Formularerstellers sehen Sie eine modifizierbare Vorschau Ihres Formulars mit den wichtigsten Feldern, die bereits vorhanden sind.
Fühlen Sie sich frei, WPForms' Drag-and-Drop-Builder zu verwenden, um Felder anzupassen oder hinzuzufügen und das Formular an Ihre WordPress-Website anzupassen.
4. Anpassen von Benachrichtigungen und Bestätigungen
Die Konfiguration von Benachrichtigungen stellt sicher, dass Sie immer über neue Formulareinträge informiert werden. Gehen Sie in der Formularerstellung zu Einstellungen und dann zu Benachrichtigungen .
Hier können Sie die Standardeinstellungen für die Benachrichtigung bearbeiten, z. B. die Betreffzeile, oder die Empfänger-E-Mails nach Bedarf ändern.
Sie können jetzt im MenüEinstellungen die Option Bestätigungen auswählen, um Antworten für erfolgreiche Formularübermittlungen einzurichten.
Wählen Sie die Bestätigungsart, die am besten zu Ihrer Website passt - eine Nachricht, eine Seitenanzeige oder eine Weiterleitung.
Denken Sie daran, Ihre Änderungen zu speichern, damit Ihr Formular und seine Einstellungen auf dem neuesten Stand bleiben. Jetzt können Sie das Formular auf Ihrer Elementor-Website veröffentlichen!
5. Veröffentlichen Sie Ihr mehrstufiges Formular über Elementor
In diesem Schritt müssen Sie eine benutzerdefinierte Seite in Elementor erstellen. Klicken Sie im WordPress-Dashboard auf Seiten und dann auf die Schaltfläche Neu hinzufügen.
Geben Sie oben Ihren Seitentitel ein. Klicken Sie anschließend auf die blaue Schaltfläche Mit Elementor bearbeiten, um die Seitenerstellungsoberfläche zu starten.
Bitte warten Sie ein paar Sekunden, bis Elementor in Ihrem Browser geladen ist. Auf der linken Seite finden Sie verschiedene Elemente, die Sie zu Ihrer Seite hinzufügen können.
Als Nächstes verwenden Sie das Feld " Search Widget " oder suchen Sie unter dem Abschnitt "Basic" in Elementor nach dem WPForms-Block.
Um den WPForms-Block zu Ihrer Seite hinzuzufügen, ziehen Sie ihn einfach per Drag & Drop. Klicken Sie dann auf das Dropdown-Menü, um das Formular auszuwählen, das Sie kürzlich erstellt haben.
Jetzt ist es an der Zeit, Ihr mehrstufiges Elementor-Kontaktformular zu veröffentlichen. Klicken Sie einfach auf die Schaltfläche Veröffentlichen in der unteren Symbolleiste.
Klicken Sie abschließend auf Have a Look, um Ihr Kontaktformular anzuzeigen.
Das war's! Ihr mehrstufiges Elementor-Formular ist nun live und bereit, Antworten zu erhalten.
Erstellen Sie Ihr mehrstufiges Elementor-Formular
FAQs über Elementor Multi-Step Forms
Mehrstufige Formulare sind eine der beliebtesten Funktionen in WPForms. Hier sind einige Antworten auf die Fragen, die wir am häufigsten gestellt bekommen.
Verfügt Elementor über einen Formularersteller?
Ja, Elementor Pro verfügt über einen Form Builder. Für fortgeschrittene Funktionen wie die Erstellung von mehrstufigen Formularen bietet Ihnen die Integration von Elementor mit WPForms Pro und dem Lead Forms Addon jedoch viel mehr Optionen für die Datenerfassung, Layout-Anpassungen und Benutzerfreundlichkeit. Sie werden feststellen, dass Sie mit WPForms die Konversionsrate von Formularen erhöhen und die Zahl der Formularabbrüche reduzieren können.
Warum sollte man mehrstufige Formulare im Webdesign verwenden?
Mehrstufige Formulare bieten mehrere wichtige Vorteile gegenüber normalen Formularen:
- Wenn ein langes Formular in kleinere, überschaubare Schritte unterteilt wird, ist es für die Benutzer weniger überwältigend. Dies kann die Abbruchquote senken. Die Benutzer füllen das Formular eher aus, wenn es benutzerfreundlich ist.
- In mehrstufigen Formularen können Sie zusammengehörige Felder logisch gruppieren, so dass das Formular leichter zu verstehen und zu navigieren ist.
- Die Nutzer können sehen, wie weit sie im Prozess fortgeschritten sind, was sie ermutigen kann, das Formular auszufüllen.
- Kürzere Formularschritte sind auf mobilen Geräten leichter zu navigieren.
- Indem Sie jeweils nur einige wenige Felder anzeigen, verringern Sie den mentalen Aufwand, der von den Nutzern verlangt wird, und erleichtern so das Ausfüllen des Formulars.
Welche häufigen Anwendungsfälle gibt es für mehrstufige Formulare?
Mehrstufige Formulare werden in WordPress häufig verwendet:
- Aufschlüsselung des Kaufvorgangs auf einer eCommerce-Website: Versand, Rechnungsstellung und Überprüfung der Bestellung.
- Benutzerregistrierung: Basisinformationen, dann Präferenzen und schließlich Kontodetails.
- Umfragen und Fragebögen: Gruppierung der Fragen nach Thema oder Komplexität.
- Bewerbungen: Trennung von persönlichen Informationen, Berufserfahrung, Ausbildung und zusätzlichen Fragen.
- Buchung und Reservierung: Auswahl der Daten, dann der Dienstleistungen, dann der persönlichen Daten.
Als nächstes reparieren Sie Elementor Contact Form Notification Emails
Haben Sie Probleme, E-Mails von Elementor-Kontaktformularen zu erhalten? Es ist einfach, dieses Problem zu beheben, damit Sie immer E-Mail-Benachrichtigungen erhalten. Diese Anleitung zeigt Ihnen , wie Sie Elementor-Kontaktformulare, die keine E-Mails senden, beheben können.
Erstellen Sie Ihr mehrstufiges Elementor-Formular
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.
