TYPO3 Form: Einfach Formulare in TYPO3 anlegen

Die TYPO3-Erweiterung Form wird genutzt, um unterschiedliche Formulare für eine TYPO3-Website zu erstellen. Nutzerinnen und Nutzer können dabei auf bestehende Templates zurückgreifen oder ein komplett neues Formular anlegen.

Was ist TYPO3 Form?

TYPO3 Form ist eine Erweiterung für das CMS TYPO3, die es Nutzerinnen und Nutzern erlaubt, unterschiedliche Formulare in eine Website einzubauen. Die Extension bietet dabei sehr individuelle Konfigurationsoptionen und eine Vielzahl von nützlichen Templates. TYPO3 Form kann nicht nur von Entwicklerinnen und Entwicklern bei der Erstellung der Website genutzt werden, sondern auch von Redakteurinnen und Redakteuren, die mit den passenden Templates nur wenige Klicks zur Implementierung benötigen.

Die Formulardefinitionen werden in einer YAML-Konfigurationsdatei gespeichert und lassen sich so projektübergreifend verwenden. Durch den Einsatz von Form Finishern werden Formulare, die im Frontend ausgefüllt wurden, in der Datenbank gesichert und bei Bedarf weiterverarbeitet.

Wofür wird TYPO3 Form genutzt?

Form kann für jede Art von TYPO3-Formular eingesetzt werden. Durch die angesprochenen Templates und Konfigurationsmöglichkeiten sind viele verschiedene Einsatzzwecke für die Extension denkbar. Besonders häufig wird die Erweiterung genutzt, um Kontaktformulare auf einer Website anzubieten. Durch Finisher können dann zum Beispiel Bestätigungsmails versendet, Weiterleitungen eingesetzt oder Benachrichtigungen an die Administration veranlasst werden. Auch die Einbettung eines Formulars von Drittanbietern ist über TYPO3 Form problemlos möglich. Je nach Konfiguration kann dann auch das Redaktionsteam Formulare neu erstellen oder bestehende Formulare nach eigenen Vorstellungen anpassen.

TYPO3 Form: Welche Rollen spielen Finisher?

Die sogenannten Finisher spielen eine wichtige Rolle innerhalb der Struktur von TYPO3 Form. Hierbei handelt es sich um Aktionen, die durchgeführt werden sollen, sobald ein Formular vollständig ausgefüllt und abgeschickt wurde. Die so erhobenen Daten können zum Beispiel gespeichert und gesammelt werden – eine Aufgabe, die durch den entsprechenden Finisher erfüllt wird. Auch wenn Sie eine Bestätigungsmail versenden oder eine Info über das ausgefüllte Formular erhalten möchten, gibt es dazu die passenden Optionen.

Features der TYPO3-Form-Erweiterung

Das TYPO3-Form-Framework enthält zahlreiche Werkzeuge, die es Ihnen erlauben, Formulare individuell für Ihren Bedarf zu erstellen oder bestehende Templates zu verändern. Folgende Features gehören unter anderem zum Umfang der Erweiterung:

• Ein Editor, mit dem Sie eigene Formulare erstellen können
• JS API für die Erweiterung des Editors
• Templates für vorgefertigte Formulare
• Zusätzliche Elemente für die schnellere Anpassung
• Die Möglichkeit, Formulare in einer YAML-Konfigurationsdatei zu speichern
• Prototypen für eigene Formulare
• Die Möglichkeit, eigene Elemente zu implementieren
• Eingebaute Finisher für E-Mail, Weiterleitungen, Datenbankspeicherungen und mehr
• Optionen zur Erstellung eigener Finisher
• Eigene Prüfoptionen bei Bedarf
• Automatischer Spamschutz

TYPO3 Form installieren

Die Extension TYPO3 Form gehört zwar zur Kernausstattung des Content-Management-Systems. Da sie standardmäßig nicht installiert ist, müssen Sie die Installation aber manuell nachholen, wenn Sie die Erweiterung nutzen möchten.

TYPO3 Form: Installation via Composer

Haben Sie TYPO3 mit Composer installiert, installieren bzw. aktivieren Sie die Erweiterung folgendermaßen:

1. Überprüfen Sie mit dem folgenden Code, ob die Erweiterung aktiviert ist:

composer show | grep form

2. Ist TYPO3 Form nicht installiert, verwenden Sie anschließend diesen Code:

composer require typo3/cms-form

TYPO3-Form-Installation im Backend

Bei einer klassischen TYPO3-Installation ohne Composer ist Form in TYPO3 bereits hinterlegt, aber in den meisten Fällen noch nicht aktiviert. In diesem Fall müssen Sie lediglich die beiden folgenden Schritte durchführen:

1. Rufen Sie im Backend die Option „Verwaltungswerkzeuge“ und dann „Erweiterungen“ auf.
2. Klicken Sie beim Eintrag „TYPO3 CMS Form“ auf das „Aktivieren“-Icon.

Formulare anlegen mit TYPO3 Form

Am einfachsten erstellen Sie ein neues Formular mit dem TYPO3-Form-Framework über das Backend. Klicken Sie dafür im CMS auf der linken Seite auf das Modul „Formulare“, um die Formularverwaltung zu öffnen. Drücken Sie auf „Neues Formular erstellen“, um ein neues Formular anzulegen. Anschließend besitzen Sie zwei Optionen: Nutzen Sie ein komplett leeres Formular oder greifen Sie auf ein bereits vordefiniertes Formular zurück.

Leeres Formular

Wenn Sie mit Form ein gänzlich neues TYPO3-Formular anlegen möchten, gehen Sie dabei wie folgt vor:

1. Klicken Sie auf „+ Leeres Formular“.
2. Geben Sie dem Formular einen passenden und innerhalb des TYPO3-Backends einzigartigen Namen.
3. Bestätigen Sie den Speicherort und die Konfiguration Ihres Formulars, indem Sie auf „Next“ drücken.

4. Nun können Sie Ihr neues Formular anpassen: Unter „Formularname“ können Sie den zuvor angegebenen Namen bei Bedarf noch einmal ändern. Im darauffolgenden Feld legen Sie fest, welche Beschriftung der Absenden-Button erhalten soll.
5. Im Feld „Finisher“ wählen Sie die Aktion aus, die TYPO3 Form nach einem Klick auf den abschließenden Formular-Button ausführen soll – z. B. eine Weiterleitung auf eine andere Seite.

6. Klicken Sie nun auf „Step“ und hinterlegen Sie einen aussagekräftigen Namen für die erste Seite des Formulars. Außerdem können Sie die Beschriftung für den „Weiter“- und den „Zurück“-Button anpassen, falls Sie ein mehrseitiges Formular erstellen möchten. Einen neuen Schritt fügen Sie dabei über die Schaltfläche „Neuen Schritt erstellen“ hinzu.

7. Im nächsten Schritt klicken Sie auf „Neues Element erstellen“, um den Inhalt des Formulars zu gestalten. Dabei haben Sie unterschiedliche Möglichkeiten: Neben reinen Textfeldern, die zum Beispiel für Namen, Adressen oder Kontaktdaten genutzt werden können, gibt es unter anderem Checkboxen, einfache oder mehrfache Auswahlmöglichkeiten und fortgeschrittene Elemente wie Upload-Buttons, Datumangaben, Passworteingabe oder versteckte Elemente.

8. Klicken Sie die einzelnen Elemente nach dem Hinzufügen an, können Sie diese individuell bearbeiten und beispielsweise den Feldnamen spezifizieren oder einen Platzhalterwert vorgeben. Speichern Sie das Formular, sobald Sie alle gewünschten Felder und Seiten erstellt haben.

9. Möchten Sie ein erstelltes TYPO3-Formular einbinden, gehen Sie folgendermaßen vor: Wählen Sie die Seite an und klicken Sie auf „+ Inhalt“. Wechseln Sie im linken Seitenmenü zum Menü „Formularelemente“ und drücken Sie auf „Formular“. Im letzten Schritt wechseln Sie in den Tab „Plugin“ und wählen dort das mit der Erweiterung erzeugte Formular aus.

Vordefiniertes Formular

Auch für TYPO3 Form gibt es einsatzfertige Vorlagen, die Sie für Ihre Website nutzen können. Klicken Sie dafür auf „Vordefiniertes Formular“ und wählen Sie den passenden Typ aus (standardmäßig ist im Core lediglich die Variante „Einfaches Kontaktformular“ vorhanden). Im Anschluss können Sie die Vorlage nach Ihren Bedürfnissen anpassen. Danach fügen Sie auch dieses Formular wie zuvor geschildert einer beliebigen Seite Ihres TYPO3-Projekts hinzu.