Skip to content

Formular anlegen und in Seite einbinden

Baue ein Kontaktformular mit Name-, E-Mail-, Betreff- und Nachrichtenfeld und binde es auf einer Seite ein. Am Ende koennen Besucher das Formular abschicken und die Nachricht landet in deiner Inbox.

Was du brauchst

  • Einen Backend-Account mit Zugriff auf Komponenten → Formulare und Seitenverwaltung.
  • Eine E-Mail-Adresse, die Eingaben empfangen soll.
  • 10 Minuten.

1. Formulare-Modul oeffnen

Klick in der Seitenleiste auf Komponenten → Formulare. Die Liste der bestehenden Formulare oeffnet sich.

Formulare-Liste unter Komponenten
Jedes Formular erscheint mit Titel und Empfaengeradresse in der Liste.

2. Neues Formular anlegen

Klick oben rechts auf Formular hinzufügen. Ein Modal oeffnet sich mit zwei Feldern:

  • Titel — das interne Label des Formulars (z.B. Kontaktformular).
  • Empfaenger-E-Mail — die Adresse, an die Eingaben gehen (z.B. [email protected]).

Beide fuellen und Speichern klicken. Das neue Formular erscheint in der Liste.

Formular-hinzufügen-Modal mit Titel- und Empfaenger-E-Mail-Feldern
Titel ist fuer dich; Empfaenger-E-Mail ist, wo Eingaben ankommen.

3. Feld-Editor des Formulars oeffnen

In der Formular-Liste klick auf den Button Formularfelder an deinem neuen Formular. Das Felder-Panel oeffnet sich, noch leer.

4. Name-Feld anlegen

Klick oben im Felder-Panel auf Hinzufügen. Ein Modal fragt nach:

  • Titel des FeldesName.
  • Typ des FormularfeldsTextzeile.
  • WerttypName.
  • PflichtPflicht.
  • BreiteHalbe Breite.

Klick Speichern. Das Feld erscheint im Panel.

Formular-Feld-Modal mit Name-Einstellungen
Werttyp auf Name setzen, damit der Absendername korrekt in der E-Mail landet.

5. E-Mail-Feld anlegen

Klick erneut auf Hinzufügen. Fuelle:

  • Titel: E-Mail.
  • Typ: Textzeile.
  • Werttyp: E-Mail.
  • Pflicht: Pflicht.
  • Breite: Halbe Breite.

Klick Speichern. Dass genau ein Feld als E-Mail markiert ist, stellt sicher, dass der Reply-To-Header in der E-Mail korrekt ist.

6. Betreff-Feld anlegen

  • Titel: Betreff.
  • Typ: Textzeile.
  • Werttyp: Betreff.
  • Pflicht: Optional.
  • Breite: Volle Breite.

Klick Speichern.

7. Nachricht-Feld anlegen

  • Titel: Nachricht.
  • Typ: Textarea.
  • Werttyp: Benutzerdefiniert.
  • Pflicht: Pflicht.
  • Breite: Volle Breite.

Klick Speichern.

Klick Hinzufügen. Fuelle:

  • Titel: Ich willige in die Verarbeitung meiner Daten ein.
  • Typ: Checkbox.
  • Werttyp: Benutzerdefiniert.
  • Pflicht: Pflicht.
  • Breite: Volle Breite.

Klick Speichern. Die Checkbox bekommt einen Werte-Unterbutton; leer lassen — eine einzelne Checkbox braucht keine Optionen.

Consent ist deine Verantwortung

Das CMS erzeugt keinen Consent-Text automatisch. Schreib, was deine Rechtsabteilung freigegeben hat. Verlinke deine Datenschutzerklaerung im Checkbox-Titel, wenn die Zielgruppe reguliert ist.

9. Seite im Pagebuilder oeffnen

Geh zu Seitenverwaltung, waehle die Seite, auf der das Formular erscheinen soll (z.B. Kontakt), und klick Seite bauen. Der Pagebuilder oeffnet sich.

10. Formular-Widget droppen

In der Pagebuilder-Seitenleiste findest du das Formular-Widget. Ziehe es in eine Spalte auf der Seite, oder klick in einer leeren Spalte auf + und waehle Formular aus dem Widget-Picker.

11. Formular auswaehlen

Das Properties-Panel des Widgets erscheint rechts mit einem Feld:

  • Formular — ein Dropdown mit jedem Formular im CMS.

Waehle Kontaktformular. Klick Speichern im Properties-Panel.

12. Seite veroeffentlichen

Klick Veröffentlichen in der Top-Bar des Pagebuilders und waehle Jetzt veröffentlichen. Die Seite geht live.

13. Senden testen

Oeffne die oeffentliche Seite in einem privaten Browserfenster. Fuelle das Formular mit einem Test-Eintrag und schicke es ab. Die Benachrichtigungs-E-Mail landet an der Empfaenger-E-Mail-Adresse mit:

  • From auf den System-Absender der Site gesetzt (konfiguriert unter Einstellungen).
  • Reply-To auf den Wert im E-Mail-Feld.
  • Betreff auf den Wert im Betreff-Feld.
  • Body mit Name, Nachricht und Consent als Klartext.

Was du gelernt hast

  • Wie du ein Formular anlegst und den Empfaenger setzt.
  • Wie Feld-Werttypen die Benachrichtigungs-E-Mail formen.
  • Wie du Felder als Pflicht und Halbe-Breite markierst.
  • Wie du das Formular-Widget auf einer Seite droppst und dein Formular auswaehlst.
  • Wie du die Auslieferung mit einem Test-Eintrag verifizierst.

Wie geht's weiter

Siehe auch