Zum Inhalt springen

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

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

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

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.

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

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

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: 18.04.2023