E-Mail-Formulare

Extension Key: form

Einleitung

Für die Erzeugung von E-Mail-Formularen bringt TYPO3 schon eine eigene Extension mit: form Obwohl sie von den Funktionen her nicht mit anderen Extensions wie Powermail oder Formhandler mithalten kann, ist Sie zur Erzeugung von relativ einfachen Formularen durchaus geeignet.

Dabei bietet Sie unter anderem folgende Features:

  • Zusammenstellen der Formulare per Drag'n Drop
  • Validierung der Eingaben, z.B. auf E-Mailadressen, URL, Ziffern, Buchstaben, reguläre Ausdrücke und mehr
  • Umfangreiche Anpassungsmöglichkeit per Typoscript (eher für erfahrene TYPO3-Anwender

Einen Nachteil gibt es allerdings auch: obwohl in der Dokumentation die Einbindung von Captcha-Extensions beschrieben wird, ist das in der aktuellen Version leider nicht möglich (Stand: Januar 2013).

Alle folgenden Screenshots stammen von TYPO3 6.0.0.

Installation

form ggf. im Extension Manager installieren
form ggf. im Extension Manager installieren

Obwohl form schon bei TYPO3 mit dabei ist, sollten Sie im Extension Manager kontrollieren, ob die Extension auch installiert ist.

Statisches Template einbinden
Statisches Template einbinden

Danach müssen sie das statische Template der Extension in Ihr Root-Template einbinden.

Dieses Video zeigt, wie Sie form einrichten und ein Formular erzeugen können.

Formular anlegen

Inhaltselement Mail-Formular
Inhaltselement Mail-Formular

Danach können Sie schon beginnen, ein Formular anzulegen. Dazu erstellen Sie ein neues Inhaltselement auf der gewünschten Seite und wählen im Bereich "Formulare" das "Mail-Formular" aus.

Der Form Wizard erscheint nach dem ersten speichern
Der Form Wizard erscheint nach dem ersten speichern

In den Einstellungen des Inhaltselements können Sie das Formular im Reiter "Formular" erstellen. form bietet dabei einen Assistenten an, mit dem das Formular per Drag'n Drop zusammengestellt werden kann. Damit der Button für den sogenannten Form Wizard sichtbar wird, müssen Sie das Inhaltselement einmal speichern.

Form Wizard

Elemente per Drag'n Drop auswählen
Elemente per Drag'n Drop auswählen

Im Form Wizard können Sie die benötigten Formular-Elemente mit der Maus vom linken in den rechten Bereich ziehen. Nachdem ein Element dort platziert wurde, können Sie im Bereich "Optionen" noch Einstellungen vornehmen. Zum Beispiel die Beschriftung (label) des Feldes oder ob eine oder mehrere Gültigkeitsprüfungen durchgeführt werden sollen.

Dabei stehen Ihnen sowohl Standard-Formularelemente als auch vordefinierte Elementgruppen zur Verfügung. Auch Inhaltselemente wie Überschriften oder Textblöcke können in das Formular eingefügt werden.

Die Reihenfolge der Elemente lässt sich jederzeit per Drag'n Drop ändern.

Formulare anpassen und optimieren

Bearbeiten der Einstellungen ist direkt im Textfeld möglich
Bearbeiten der Einstellungen ist direkt im Textfeld möglich

Nachdem Sie den Form Wizard gespeichert und geschlossen haben, sehen Sie in dem Textfeld im Bereich "Formular" die Konfigurationseinstellungen des Formulars. Dabei handelt es sich um Typoscript.

Änderungen am Formular können entweder über den Form Wizard oder aber auch direkt in diesem Textfeld vorgenommen werden.

Besonders interessant ist dabei der Bereich postProcessor.

Hier kann man noch ein paar Verbesserungen vornehmen wie z.B. das Anpassen des Benachrichtigungstextes nach dem Absenden des Formulars oder das Einsetzen der E-Mailadresse des Website-Besuchers als Absender-Adresse der verschickten E-Mail.

In Verbindung mit TYPO3 6.0.0 tritt auch ein Fehler auf: nach dem Absenden des Formulars wird kein Bestätigungstext ausgegeben. Diesen Fehler kann man aber lösen, indem man diesen Text im Bereich postProcessor über den Parameter messages.success definiert.

In der Standardeinstellung verhält sich form so, dass nach dem Abschicken des Formulars zuerst eine "Zwischenseite" erscheint, auf der der User seine Eingaben nochmal kontrollieren kann. Hier hat er dann die Möglichkeit, entweder zurück zum Formular zu gehen oder die Nachricht endgültig abzuschicken. Wenn Sie sich diesen Zwischenschritt sparen wollen, können Sie hier auch den Parameter confirmation = 0 setzen.

Eine Beispiel-Konfiguration

# deaktivieren der Bestätigungsseite, Formular wird dann direkt verschickt
confirmation = 0

postProcessor {
 1 = mail
 1 {
   recipientEmail = empfaenger.der@email.net
 
   # die Absender-E-Mailadresse wird dynamisch aus dem Formularfeld mit dem Namen email ausgelesen
   senderEmailField = email

   # der Absender-Name wird dynamisch aus dem Formularfeld nachname ausgelesen
   senderNameField = nachname

   subject = Anfrage über form

   # Nachricht, die nach dem Absenden des Formulars angezeigt wird
   # Hier kann man auch HTML verwenden
   messages.success = TEXT
   messages.success.value (
     <h2>Danke für Ihre Nachricht</h2>
     <p>Wir werden sobald wie möglich mit Ihnen in Kontakt treten.</p>
   )
 }
}

Weitere Parameter finden Sie in der Dokumentation der Extension ab Seite 105 im Bereich postprocessors.

Mailversand anpassen

Bei TYPO3 6.0.0 gibt es momentan noch das Problem, dass nach dem Abschicken eines Formulars keine Bestätigung angezeigt wird. Das lässt sich jedoch recht einfach beheben. Außerdem kann man den Mail-Versand noch ein wenig optimieren und anpassen.

Aktualisiert: 29.06.2016