Arbeiten mit dem Layout-Builder

Mit dem Layout-Builder gestaltest du das Erscheinungsbild eines Event-Dialogformulars. Während du im Bereich „Dialogelemente“ festlegst, welche Felder, Texte, Auswahlmöglichkeiten oder Formularbausteine im Formular enthalten sind, geht es im Bereich „Layout des Formulars“ um die optische Darstellung: Farben, Abstände, Breiten, Kopfbereich, Inhaltsbereich, Seitenleiste, Formularbereich und Footer.

Wichtig ist: Die Option zum Bearbeiten des Layouts steht nicht bei jedem Event automatisch zur Verfügung. Sie ist nur dann sichtbar beziehungsweise nutzbar, wenn beim Anlegen des Events ein individuelles Layout ausgewählt wurde. Wenn ein Event ein Standardlayout verwendet, kann das Formular zwar inhaltlich bearbeitet werden, das Layout selbst ist dann aber nicht frei anpassbar. Das verhindert unbeabsichtigte Änderungen an zentral vorgegebenen Designs und sorgt dafür, dass Standardlayouts einheitlich bleiben.

Wechsel zwischen Dialogelementen und Layout

Oben im Formularbuilder kannst du zwischen „Dialogelemente“ und „Layout des Formulars“ wechseln. Unter „Dialogelemente“ bearbeitest du den Aufbau des Formulars selbst, also zum Beispiel Eingabefelder, Auswahlfelder, Pflichtfelder, Überschriften, Hinweise, Downloads oder Umfrageelemente. Über „Layout des Formulars“ wechselst du in die Gestaltungsebene.

Dort siehst du links beziehungsweise mittig eine Vorschau des Dialogformulars. Diese Vorschau zeigt, wie das Formular später für eingeladene Personen oder externe Teilnehmer wirkt. Änderungen am Layout lassen sich dadurch direkt im Zusammenhang beurteilen. Du siehst nicht nur einzelne Einstellungen, sondern auch, wie Überschriften, Formularfelder, Eventinformationen, Sidebar und Footer zusammenspielst.

Design und Grundeinstellungen

Im Bereich „Design“ werden grundlegende Layout-Einstellungen vorgenommen. Dazu gehört zum Beispiel die Breite des Formulars. Je nach Einstellung kann das Formular die volle verfügbare Breite nutzen oder mit einer festen Breite dargestellt werden. Eine feste Breite eignet sich besonders für klassische Landingpages oder kompakte Event-Anmeldeseiten. Eine volle Breite kann sinnvoll sein, wenn das Formular stärker wie eine moderne Webseite wirken soll oder viel Inhalt enthält.

Zusätzlich kannst du die Hintergrundfarbe anpassen. Damit lässt sich das Dialogformular optisch an ein Corporate Design, eine Kampagne oder ein Veranstaltungsmotto angleichen. Auch der Linkstyle kann eingestellt werden, zum Beispiel ob Links unterstrichen oder nicht unterstrichen dargestellt werden. Diese Einstellung wirkt klein, beeinflusst aber deutlich, wie ruhig oder auffällig ein Formular erscheint.

Bereiche des Layouts

Der Layout-Builder unterteilt das Formular in mehrere Abschnitte. Dadurch kannst du gezielt an einzelnen Bereichen arbeiten, ohne das gesamte Formular auf einmal verändern zu müssen.

Die „Preheader Section“ betrifft den Bereich oberhalb des eigentlichen Headers. Dort können je nach Layout zusätzliche Informationen oder schmale Hinweise platziert sein. Die „Header Section“ ist der Kopfbereich des Formulars. Hier werden meist Eventtitel, grafische Elemente oder zentrale Einstiegsinformationen sichtbar. Gerade bei öffentlichen Einladungen ist dieser Bereich wichtig, weil er den ersten Eindruck prägt.

Die „Event Details Section“ enthält typische Informationen zum Event, zum Beispiel Datum, Uhrzeit, Ort oder weitere organisatorische Angaben. Diese Informationen sollten gut sichtbar, aber nicht überladen dargestellt werden. Die „Sidebar Section“ kann zusätzliche Inhalte aufnehmen, etwa Kontaktinformationen, Ansprechpartner, weiterführende Links oder ergänzende Hinweise. Wenn ein Formular umfangreicher ist, hilft die Sidebar dabei, wichtige Zusatzinformationen bereitzustellen, ohne den eigentlichen Formularfluss zu unterbrechen.

Die „Content Section“ umfasst den zentralen Inhaltsbereich. Dort stehen Beschreibungstexte, erklärende Inhalte oder größere Textblöcke. Der Bereich „Formular“ betrifft die Darstellung der eigentlichen Eingabefelder. Hier ist besonders wichtig, dass das Formular übersichtlich bleibt, Pflichtfelder klar erkennbar sind und die Abstände eine angenehme Bedienung ermöglichen.

Die „Footer Section“ bildet den unteren Abschluss des Formulars und kann zum Beispiel rechtliche Hinweise, Unternehmensinformationen oder Links enthalten.

Vorschau und Speichern

Über „Vorschau Layout“ kannst du prüfen, wie das Layout wirkt, bevor du es endgültig verwendest. Das ist besonders hilfreich, wenn du mehrere Bereiche verändert hast. So erkennst du frühzeitig, ob Abstände passen, Texte lesbar sind und wichtige Inhalte nicht untergehen.

Mit „Layout speichern“ sicherst du deine Änderungen. Erst danach sind die Anpassungen dauerhaft übernommen. Es empfiehlt sich, nach größeren Änderungen nicht nur im Builder selbst zu prüfen, sondern auch das eigentliche Dialogformular aufzurufen. So siehst du das Formular aus Sicht der späteren Teilnehmerinnen und Teilnehmer.

Meine Layouts

Im Layout-Bereich gibt es außerdem die Option „Meine Layouts“. Darüber können gespeicherte Layouts verwendet oder wieder aufgegriffen werden. Das ist praktisch, wenn mehrere Events ähnlich aufgebaut sein sollen. Statt jedes Layout vollständig neu zu gestalten, kann ein bestehendes Layout als Grundlage dienen und bei Bedarf angepasst werden.

Mehr Aktionen

Das Menü „Mehr Aktionen“ bietet zusätzliche Funktionen rund um das Event und das Dialogformular. Über „Eventdetails anzeigen“ gelangst du zurück zu den allgemeinen Informationen des Events. Das ist hilfreich, wenn du während der Layoutarbeit prüfen möchtest, welche Basisdaten, Zeiten oder Einstellungen für das Event hinterlegt sind.

Mit „Dialogformular aufrufen“ öffnst du das Formular selbst. Dadurch kannst du testen, wie es später tatsächlich angezeigt wird. Diese Ansicht ist besonders wichtig, weil sie näher an der realen Nutzung ist als die reine Bearbeitungsansicht.

Über „Code erzeugen“ kann ein Einbettungs- oder Aufrufcode erzeugt werden. Diese Funktion wird verwendet, wenn das Dialogformular nicht nur direkt verlinkt, sondern zum Beispiel in eine andere Seite eingebunden oder technisch weitergegeben werden soll.