Avada Forms: Formulare im Avada Theme

Mit Avada Forms kannst du in wenigen Schritten professionelle und ansprechende Formulare erstellen, die die Benutzererfahrung verbessern. In diesem Blog-Artikel erfährst du alles über die Vorteile von Avada Forms und erhältst eine detaillierte Schritt-für-Schritt-Anleitung zur Erstellung deines eigenen Formulars. Optimiere deine Formulare mit meinen Tipps für die perfekte Formularerstellung mit Avada Forms.

Gut gestaltete Formulare sind entscheidend für den Erfolg deiner Website, da sie eine reibungslose Interaktion mit deinen Besuchern ermöglichen. Mit Avada Forms kannst du mühelos ansprechende und benutzerfreundliche Formulare erstellen, um die Conversion-Rate zu steigern und wichtige Daten von deinen Nutzern zu sammeln. Dank der intuitiven Benutzeroberfläche und zahlreichen Anpassungsmöglichkeiten lassen sich individuelle Formulare im Handumdrehen erstellen.

Vorgefertigte Avada Formular zum importieren aus Avada Studio

Als erstes erstellst du in Avada Forms ein neues Formular mit eindeutigen Namen, z.B. Kontaktformular. Danach kommst du in den regulären Avada Edior mit dem ein beliebiges Spaltenlayout erstellen kannst.

Dann beginne damit, die erforderlichen Felder auszuwählen und anzupassen, um sicherzustellen, dass du alle notwendigen Informationen von deinen Besuchern erhältst. Nutze die vielfältigen Form Elemente, um das Design und die Funktionalität deines Formulars zu optimieren. Frage am besten nur die nötigsten Informationen ab die du wirklich benötigst um die Konversionsrate deines Formulars zu erhöhen.

Avada Forms bietet eine Vielzahl von Feldtypen, um verschiedene Informationen von Benutzern zu sammeln. Im Bild siehst du die grundlegenden Formularfelder, die verfügbar sind.

• Text Field (Kurz): Erlaubt Benutzern die Eingabe von kurzen Texten oder Zahlen
• Textaerea Field (Lang): Bietet Benutzern einen größeren Bereich für längere Texteingaben wie Kommentare oder Nachrichten
• E-Mail Field: Erfasst die E-Mail-Adresse des Benutzers und validiert sie, um sicherzustellen, dass sie einem gültigen Format entspricht
• Phone Number Field: Ermöglicht Benutzern die Eingabe von Telefonnummern und kann optional ein spezifisches Format erfordern
• Select Field: Bietet eine Liste von Optionen, aus denen Benutzer auswählen können
• Image Select Field: Benutzer können mehrere Bilder als Optionen auswählen
• Radio Field: Präsentiert eine Liste von Optionen, aus denen Benutzer genau eine auswählen können
• Checkbox Field: Erlaubt es Benutzern, eine oder mehrere Optionen durch Ankreuzen auszuwählen
• Date Field: Zeigt einen interaktiven Kalender an, damit Benutzer ein Datum auswählen können
• Time Field: Benutzer können hier ein Uhrzeitformat auswählen
• Upload Field: Erlaubt Benutzern das Hochladen von Dateien, z. B. Bilder oder Dokumente
• reCAPTCHA Field: Fügt ein Google CAPTCHA-Feld hinzu, um sicherzustellen, dass das Formular nicht von Bots gesendet wird
• Consent Field: Fügt eine Checkbox für die Datenschutzerklärung hinzu
• Notice Field: Fügt Hinweistexte hinzu um Fehlermeldungen oder das erfolgreiche Absenden innerhalb des Formulars anzuzeigen
• Range Field: Ermöglicht das anzeigen eines Range-Sliders für die Anzeige von min. und max. Werte
• Hidden Field: Verbirgt ein Feld im Formular, das jedoch Daten übermittelt, ohne dass der Benutzer es sieht
• Honeypot Field: Ebenfalls ein verstecktes Feld zur Abwehr von Spambots
• Rating Field:Benutzer können hier eine Sternebewertung abgeben
• Passwort Field:Das Passwortfeld ist ein spezielles Textfeld in einem Formular, das nicht anzeigt, was der Benutzer eingibt. Dieser Wert wird dann bei der Übermittlung des Eintrags weitergegeben.
• Number Field: Hier kann der Benutzer numerische Eingaben tätigen
• Submit Button: Erstellt einen absende Button zum absenden des Formulars

Diese Felder bieten eine flexible Möglichkeit, benutzerdefinierte Formulare zu erstellen, die den spezifischen Anforderungen einer Website gerecht werden. Durch die Kombination dieser Felder können auch komplexe Formulare erstellt werden.

In den Avada Form Options kannst du das Design deines Formulars anpassen und die technisch nötigen Einstellungen für das Formular festlegen.

Allgemein: Hier kannst festlegen ob das Formular nur eingeloggten Benutzer angezeigt werden soll. Unter Security Nonce Method legst du einmalige Sicherheitsstandards für das Formular fest.

Appearance: Unter Appearance kannst du das Design des Formulars bestimmen.

Submission: Im Bereich Submission legst du fest, was nach dem absenden des Formulars passieren soll. Um Formulareinträge später auch im Backend zu sehen, wähle „Save to Database“. Send to URL leitet den Benutzer auf eine andere URL nach dem absenden. Des weiteren stehen die Optionen Mailchimp, Hubspot und Open Off Canvas zur Verfügung.

Notifications: Lege hier die Optionen für die Benachrichtigungen fest wie Empfänger E-Mail Adresse, Betreff und weiter E-Mail Empfänger. Im Bereich Email Message kannst spezifisch festlegen, welche ausgefüllten Felder übermittelt werden sollen. Wenn du dort nichts einträgst, werden alle Felder übermittelt.

Confirmation: Hier kannst du festlegen, was der Besucher nach dem absenden des Formulars zu sehen bekommt. Auswählen kannst du „Display Message“ oder „Redirect to URL“.

Step Progress: Hier kannst du den Navigations-Style eines Multi-Step-Formulars festlegen.

Privacy: Hier kannst du Einstellung bezüglich der Privatssphäre der übermittelten Daten festlegen.

Import / Export: Hier kannst Du das Formular inkl. Layout und Page Options speichern, exportieren oder Importieren.

Unter den Avada Options – Forms – Forms Styling kannst du zusätzlich globale Designeinstellung für Avada Forms, aber auch für zusätzlich installierte Formular Plugins festlegen wie z.B. Contact Form 7.

Die Multi-Step-Funktion in Avada Forms ermöglicht es Benutzern, lange Formulare in mehrere Abschnitte oder Schritte aufzuteilen, um die Benutzererfahrung zu verbessern und die Abschlussrate zu erhöhen. Anstatt Benutzer mit einem langen und überwältigenden Formular zu konfrontieren, wird das Formular in überschaubare Abschnitte unterteilt, die nacheinander ausgefüllt werden können.

So funktioniert die Multi-Step-Funktion in Avada Forms:

1. Abschnittseinteilung: Im Forms Editor kannst Du das Formular in mehrere Abschnitte unterteilen, wobei jeder Abschnitt eine Gruppe von Feldern enthält. Diese Abschnitte werden als „Schritte“ bezeichnet. Dazu lege nach deinem ersten Abschnitt einen neuen Container an und wähle unter „Special“ – Form Step. Der Form Step Container wird in grau angezeigt. Mit einem klick auf das Stiftsymbol kannst du einen Titel und ein Icon festlegen.

2. Schritt-nach-Schritt-Navigation: Benutzer können durch die verschiedenen Abschnitte des Formulars navigieren, indem sie Schritt für Schritt vorwärts oder rückwärts gehen. Dies geschieht normalerweise durch die Verwendung von „Weiter“- und „Zurück“-Schaltflächen.
Dazu erstellst du einen normalen Button (keinen Submit-Button) aus den Design Elements und wählst unter Button URL den dynamischen Content. Hier kannst du auswählen dann zwischen „Next Step“ oder „Previous Step“ wählen.

3. Validierung bei jedem Schritt: Avada Forms validiert die Eingaben des Benutzers bei jedem Schritt, um sicherzustellen, dass die erforderlichen Felder ausgefüllt sind und dass die Daten im richtigen Format vorliegen, bevor der Benutzer zum nächsten Schritt fortschreiten kann.

4. Statusanzeige: Eine Statusanzeige oder Fortschrittsleiste kann dem Benutzer anzeigen, in welchem Schritt des Formulars er sich befindet und wie viele Schritte noch zu absolvieren sind.

5. Flexibilität und Anpassung: Der Formularersteller kann die Anzahl der Schritte festlegen, die Reihenfolge der Schritte ändern und die Felder in jedem Schritt anpassen, um den Anforderungen des Formulars gerecht zu werden.

Die Multi-Step-Funktion ist besonders nützlich für komplexe Formulare, bei denen viele Informationen gesammelt werden müssen, da sie den Prozess für Benutzer weniger entmutigend und intuitiver gestaltet. Durch die Aufteilung des Formulars in kleinere Teile wird die Wahrscheinlichkeit erhöht, dass Benutzer das Formular abschließen, da sie nicht von einem umfangreichen Formular überfordert werden. Multi Step Formulare werden auch gern für Umfragen verwendet.

Die dynamischen Funktionen in Avada Forms ermöglichen eine erweiterte Anpassung und Funktionalität innerhalb der Formulare. Hier sind einige der dynamischen Funktionen in Avada Forms:

1. Bedingte Logik: Mit bedingter Logik können Formularfelder basierend auf den Auswahlmöglichkeiten des Benutzers dynamisch ein- oder ausgeblendet werden. Dies ermöglicht es, die Sichtbarkeit von Feldern basierend auf vorherigen Eingaben anzupassen, was zu benutzerfreundlicheren und interaktiveren Formularen führt.

2. Dynamische Daten: Avada Forms ermöglicht die Integration von dynamischen Daten in Formularfelder, wie z. B. aktuellen Datum und Uhrzeit, Benutzerinformationen oder sogar Daten aus anderen Quellen oder Plugins. Dies erleichtert die Personalisierung von Formularen und die automatische Befüllung von Feldern mit relevanten Informationen.

3. Dynamische Empfängeradressen: Formulare können so konfiguriert werden, dass sie E-Mails an verschiedene Empfängeradressen basierend auf den Eingaben des Benutzers oder anderen Parametern senden. Dies ermöglicht es, Formularantworten automatisch an die richtigen Personen oder Abteilungen weiterzuleiten.

4. Dynamische Bestätigungsseiten: Die Bestätigungsseite nach dem Absenden des Formulars kann dynamisch gestaltet werden, um den Benutzern eine personalisierte Nachricht oder weitere Anweisungen basierend auf ihren Eingaben zu zeigen. Dies verbessert die Benutzererfahrung und ermöglicht es, den Benutzer nach dem Absenden des Formulars weiter zu führen.

5. Integrationen mit Drittanbietern: Avada Forms bietet Integrationen mit verschiedenen Drittanbieter-Diensten und Plugins, die es ermöglichen, Formulardaten automatisch an andere Systeme zu übertragen oder bestimmte Aktionen basierend auf den Formulareingaben auszulösen. Dies erweitert die Funktionalität der Formulare und ermöglicht eine nahtlose Integration in bestehende Workflows.

Durch diese dynamischen Funktionen können Formulare in Avada Forms noch flexibler gestaltet und an die spezifischen Anforderungen einer Website angepasst werden.

Du kannst etwa die Benutzeroberfläche benutzerfreundlicher gestalten, indem du klare Anweisungen und Hinweise hinzufügst. Zudem ist es ratsam, das Formular auf mobile Geräte zu optimieren, um eine reibungslose Erfahrung für alle Nutzer zu gewährleisten.

Ein weiterer Tipp ist die Überprüfung der Feldanordnung und -beschriftung, um sicherzustellen, dass sie logisch und leicht verständlich sind. Weiterhin kannst du mit Avada Forms auch Farben und Schriftarten anpassen, um das Erscheinungsbild deiner Formulare zu verbessern.

Eine weitere bewährte Methode ist es, nur die notwendigen Felder abzufragen und zusätzliche Informationen optional zu machen. Dadurch verhinderst du Überforderung der Nutzer und erhöhst die Conversion-Rate deiner Formulare. Denke auch daran, regelmäßig Tests durchzuführen und dein Formular basierend auf den Ergebnissen zu optimieren. Auf diese Weise kannst du sicherstellen, dass deine Formulare immer effektiv sind und positive Ergebnisse liefern.

Dank der benutzerfreundlichen Oberfläche und zahlreichen Anpassungsmöglichkeiten kannst du im Handumdrehen professionelle Formulare mit Avada Forms erstellen um die Benutzererfahrung auf deiner Website zu verbessern.

Der Avada Forms Editor bietet dir viele Werkzeuge und Einstellungen um Formulare auf deiner Webseite ansprechend zu gestalten und zu dynamisieren.