Formular mit dem Pagebuilder erstellen Drucken

Die zwei Möglichkeiten der Formularerstellung

Jede Website benötigt ein Formular. Ob Sie Leads sammeln, Online-Schadenmeldungen ermöglichen, Preise kalkulieren, Zahlungen akzeptieren oder einfach Besuchern erlauben möchten, Sie zu erreichen. Wählen Sie aus zwei Optionen zur Erstellung eines Formulars.

1. Formular-Tool (Inhalte > Formulare)
   Die erste Option ist für jede Art von Formularen und darüber hinaus auch für komplexe Formulare interessant, beispielsweise für mehrseitige Formulare, Kalkulationen u.v.m.
   Sie erreichen sie auf Ihrem Dashboard unter INHALTE > Formulare. Diese dort erstellten Formulare werden mit einem sogenannten Shortcode in Ihre (Pagebuilder-)Seite eingefügt. Die Optik der Formulare können Sie unter INHALTE > Formular-Einstellungen > Optik vornehmen. Die Dokumentation dieser Formulare finden Sie in der Kategorie FORMULARE.
2. Pagebuilder Formulare (Inhalte > Pagebuilder-Formulare)
   Wir beschäftigen uns auf dieser Seite mit der Erstellung von Formularen direkt im Pagebuilder, deren Übermittlungen/Formulareinsendungen Sie auf Ihrem Dashboard unter FORMULARE > PAGEBUILDER-FORMULARE finden (und als CSV exportieren können). Der Vorteil dieser Option: Die so erstellten Formulare lassen sich optisch aufwerten und nahtlos in Ihr Layout integrieren. Dafür sind Sie in der Funktion jedoch eingeschränkt. Dennoch lassen Sie sich optimal für Kontaktformulare, Newsletteranmeldungen und jegliche Form von Leadformularen für Landingpages nutzen.

TIPP: Wir empfehlen Ihnen, Formulare NICHT direkt im Pagebuilder zu erstellen, sondern dafür das Formulartool unter Inhalte > Formulare zu nutzen. Die von uns vordefinierten und zentral gepflegten Formulare wie Kontaktformular und Schadenmeldung wurden ebenso mit dem Formulartool erstellt und werden mit einem sog. Shortcode in Ihre Seite eingebaut. Letztendlich ist es aber Geschmacksache. Fortgeschrittene Benutzer, die ihre Formulare an externe Tools anbinden möchten, haben mit den Pagebuilder-Formularen jedoch mehr Möglichkeiten.

Feldtypen

Sie können in Ihrem Formular folgende Feldtypen nutzen:

Erstellen eines Formulars im Pagebuilder

Erstellen Sie zunächst eine neue Seite ( Inhalte > Seiten -> Seite erstellen) und bearbeiten Sie sie mit Brizy. Natürlich können Sie auch eine vorhandene Seite bearbeiten. Sie können auch eine Vorlage anstelle einer Seite erstellen / bearbeiten.

Ziehen Sie im Pagebuilder das Formularelement in den Zeichenbereich.

Standardmäßig haben Sie ein Formular, das aus drei Feldern besteht. Um ein vorhandenes Feld zu entfernen, klicken Sie auf das gewünschte Feld und anschließend auf das Papierkorbsymbol in der angezeigten Einstellungsleiste, in der Sie auch den Feldtyp ändern können, indem Sie in der Registerkarte Feld den Typ auswählen. Um ein neues Feld hinzuzufügen, duplizieren Sie einfach ein vorhandenes mit Klick auf das Duplikat-/Kopiersymbol.

Festlegen der Aktion

Standardmäßig werden Ihre Formularübermittlungen an den integrierten Lead-Manager gesendet, den Sie auf Ihrem Dashboard unter Inhalte > Formulare > Leads finden. Sie können eine benutzerdefinierte Formularaktion festlegen, um die Formularübermittlungen an Ihr E-Mail-Konto oder an Drittanbieter-Tools wie Sendinblue, MailerLite, HubSpot, Mailchimp usw. zu senden.

Unsere vordefinierten und von uns zentral gepflegten Formulare wie Kontaktformular und Schadenmeldung wurden mit Gravity Forms erstellt, dem wohl professionellsten Formular-Plugin für WordPress. Dieses verfügt über eine CleverReach-Anbindung. Um das Newsletter-Tool CleverReach für Ihr E-Mail-Marketing zu nutzen, müssen Sie entweder die o.g. Option 1 der Formularerstellung nutzen, also ohne Pagebuilder (einfache Anbindung mit Shortcode), oder mit Zapier arbeiten (nur fortgeschrittenen Usern zu empfehlen). Alternativ können wir noch Sendinblue empfehlen. Nähere Informationen zu CleverReach finden Sie hier: Newsletter-Tool CleverReach

Folgende Anbindungen sind möglich, wenn Sie direkt im Pagebuilder Formulare erstellen möchten.

Um die Formularaktion festzulegen, können Sie auf die Aktionsschaltfläche klicken, gefolgt vom Plug-Symbol in der angezeigten Einstellungsleiste.

Festlegen eines erforderlichen Feldes

Die meisten Online-Formulare verfügen über mindestens ein Pflichtfeld. Wenn Sie ein bestimmtes Feld als Pflichtfeld festlegen möchten, klicken Sie auf das zugehörige Feld, um die Einstellungsleiste zu öffnen. Klicken Sie in der Einstellungsleiste auf die Registerkarte Feld und schalten Sie die Option Erforderlich um .

Etikett und Platzhalter aktivieren / deaktivieren

Um die Beschriftung und den Platzhalter der Felder zu aktivieren / deaktivieren, öffnen Sie die Einstellungsleiste erneut und klicken Sie auf die Registerkarte Feld. Sie können die Optionen zum Aktivieren / Deaktivieren der Beschriftung und des Platzhalters auf der Unterregisterkarte Erweitert anzeigen.

Um den Platzhaltertext und den Beschriftungstext zu ändern, können Sie einfach die Beschriftung markieren, die Sie ändern möchten (oder löschen), und Ihren neuen Platzhalter oder Text eingeben.

Festlegen der benutzerdefinierten Nachrichten

Nach dem Absenden eines Formulars erhält Ihr Besucher entweder eine Erfolgsmeldung oder eine Fehlermeldung. Für jede Bedingung existiert eine Standardnachricht. Sie können auch eine benutzerdefinierte Nachricht für jede Bedingung festlegen, wenn Sie möchten. Klicken Sie dazu auf die Aktionsschaltfläche, um die Einstellungsleiste zu öffnen. Klicken Sie in der Einstellungsleiste auf das Kettensymbol. Sie können eine benutzerdefinierte Erfolgsmeldung im Feld Erfolg (Success) auf der Registerkarte Nachricht (Message) festlegen. Um eine benutzerdefinierte Fehlermeldung festzulegen, können Sie einfach Ihre bevorzugte Nachricht in das Feld Fehler (Error) eingeben.

Das Formular stylen

Sobald Sie die Felder eingerichtet haben, können Sie mit dem Stylen des Formulars beginnen. Wenn Sie den Formularhintergrund festlegen möchten (nicht den Feldhintergrund), können Sie die Spalte oder den Block bearbeiten, die dem Formularelement zugeordnet sind.

Anpassen der Felder Hintergrund, Textfarbe und Rahmenfarbe

Klicken Sie auf eine beliebige Stelle im Formular, um die Einstellungsleiste zu öffnen. Sobald die Einstellungsleiste angezeigt wird, klicken Sie auf die Registerkarte Farben , um die Farbauswahl zu öffnen. Um den Feldhintergrund festzulegen, klicken Sie auf die Unterregisterkarte Bg. Um die Textfarbe festzulegen, klicken Sie auf die Unterregisterkarte Text. Um die Rahmenfarbe festzulegen, klicken Sie auf Border. Sie können die Farben dieser Elemente sowohl für den Normalzustand als auch für den Schwebezustand festlegen. Klicken Sie einfach auf das Symbol auf der linken Seite des Selektors, um zwischen den Status zu wechseln.

Anpassen der Typografie des Feldtextes

Um die Typografie des Feldtextes festzulegen, klicken Sie wieder auf eine beliebige Stelle im Formular, um die Einstellungsleiste zu öffnen. Klicken Sie dort auf die Registerkarte Text, um die Typografie-Einstellungen zu öffnen. Links können Sie die Schriftfamilie auswählen. Einstellungen für Schriftgröße, Schrifthöhe und Buchstabenabstand nehmen Sie rechts vor.

Festlegen der Feldgröße und des Rahmenradius

Bei der Feldgröße sind zwei Variablen beteiligt: ​​Höhe und Breite. Um die Höhe der Felder festzulegen, öffnen Sie die Einstellungsleiste (indem Sie wieder auf eine beliebige Stelle im Formular klicken) und dort auf die Registerkarte Formular. Sie sehen eine Unterregisterkarte Hintergrund. Klicken Sie darauf und wählen Sie eine der verfügbaren Größenoptionen. Wie Sie sehen können, gibt es auch eine Option zum Festlegen des Rahmenradius (die Option Ecke ).

Im Gegensatz zur Höhe können Sie für jedes Feld eine andere Breite festlegen. Klicken Sie dazu auf das Feld, dessen Breite Sie festlegen möchten und dann auf das Zahnradsymbol in der angezeigten Einstellungsleiste. Bewegen Sie den Schieberegler, um den Breitenwert festzulegen.

Styling der Aktionstaste

Um die Aktionsschaltfläche zu gestalten, öffnen Sie wieder die Einstellungsleiste durch Klick auf das Formular. Zunächst können Sie das Indexzeigersymbol öffnen, um die Schaltflächengröße, den Füllstil, den Rahmenradius (Ecke) und die Rahmenstärke festzulegen. Sie können auch das Symbol, die Symbolgröße und die Symbolposition festlegen.

Um die Typografie des Schaltflächentextes festzulegen, können Sie auf die Registerkarte Text in der Einstellungsleiste klicken. Um den Standardtext zu ändern, können Sie einfach den vorhandenen Text markieren (oder löschen) und durch Ihren neuen Text ersetzen.

Um die Hintergrundfarbe der Schaltfläche, die Textfarbe der Schaltfläche und die Farbe des Rahmenradius festzulegen , können Sie auf die Registerkarte Farben klicken , um die Farbauswahl zu öffnen. Sie können die Schaltfläche Hintergrund auf dem Set Bg Unterregister, auf die Schaltfläche Textfarbe auf dem Textunterregister, und Rahmenfarbe auf dem Grenzunterregister. Sie können die Farben sowohl für den Normal- als auch für den Schwebezustand festlegen. Klicken Sie einfach auf die Symbole auf der linken Seite, um zwischen den Status zu wechseln.

Um die Tastenbreite einzustellen, klicken Sie auf das Zahnradsymbol in der Einstellungsleiste. Die Ausrichtung der Schaltfläche ändern Sie auf der Registerkarte Ausrichten.

Das klingt alles etwas kompliziert. Spielen Sie einfach etwas herum und Sie werden schnell sehen, dass es im Prinzip recht einfach ist.