Kontaktformular mit mehreren Adressen als Extension

Für mehrere Webseiten aus der Agentur meiner Frau sollte ein Kontaktformular entstehen. Die Webseiten sind mit TYPO3 aufgebaut. Daher sollte eine Extension entstehen.

Das Formular sollte Namen, e-Mail Adresse, Telefonnummer und Nachricht übermitteln. Name, e-Mail Adresse und Nachricht müssen ausgefüllt werden. Eine Fehlerabfrage sollte entsprechende Meldungen anzeigen. Wenn das Formular richtig ausgefüllt ist, sollte es an eine e-Mail Adresse verschickt werden. Die zur Verfügung stehenden Adressen sollten an zentraler Stelle pflegbar sein.

Dazu entstand eine Extension, die sowohl das Kontaktformular als auch die Eingabe der e-Mail Adressen im Backend steuert.

Download Referenzliste als PDF

TYPO3 Extension mit Extbase und Fluid

Kontaktformular auf Webseite

Referenz Thomas Berscheid Kontaktformular mehrere Adressen Fehlerprüfung TYPO3 Extension Template CSS TypoScript TS CSS HTML Programmierung Köln

Die Startansicht des Kontaktformulars auf der Webseite 

Quelltext des Formulars in Extension

Referenz Thomas Berscheid Kontaktformular mehrere Adressen Fehlerprüfung TYPO3 Extension Template CSS TypoScript TS CSS HTML Programmierung Köln

Das Kontaktformular bietet vier Eingabefelder unterschiedlicher Art für die zu verarbeitenden Daten. Die Benennung der Felder erfolgt über die Language Datei der Extension. Das Formular ist im Partials-Ordner abgelegt und wird an mehreren Stellen eingebunden (Eingabe und Überprüfung der Fehler).

Quelltext Controller

Referenz Thomas Berscheid Kontaktformular mehrere Adressen Fehlerprüfung TYPO3 Extension Template CSS TypoScript TS CSS HTML Programmierung Köln

Wenn der Benutzer das Formular abgeschickt hat, erfolgt eine Abfrage, ob die als required gesetzten Felder ausgefüllt sind. Ist dies nicht der Fall, wird für jedes Feld eine Fehlermeldung generiert. Ist dies geschehen, wird der jeweilige Inhalt in die Klasse geschrieben, die das Verschicken der e-Mail auslöst.

Validierung von Fehlern bei Eingabe

Referenz Thomas Berscheid Kontaktformular mehrere Adressen Fehlerprüfung TYPO3 Extension Template CSS TypoScript TS CSS HTML Programmierung Köln

Wenn der Kunde ein Feld oder mehrere Felder nicht ausgefüllt hat, bekommt er eine entsprechende Fehlermeldung. Diese wird über ein eigenes Formular in Fluid generiert.

Meldung zu erfolgreich verschickten Formulardaten

Referenz Thomas Berscheid Kontaktformular mehrere Adressen Fehlerprüfung TYPO3 Extension Template CSS TypoScript TS CSS HTML Programmierung Köln

Wenn der Benutzer alle Angaben gemacht und auf „Abschicken“ geklickt hat, wird eine e-Mail generiert. Eine vorgeschaltete Darstellung der Eingaben findet nicht statt. Der Zwischenschritt führte bei mehreren Kunden dazu, dass sie die Mail nicht verschickt haben. Daher sollte die Funktion so einfach wie möglich gehalten werden.

Pflege e-Mail Adressen im Backend

Referenz Thomas Berscheid Kontaktformular mehrere Adressen Fehlerprüfung TYPO3 Extension Template CSS TypoScript TS CSS HTML Programmierung Köln

Das Kontaktformular wird an jeweils nur eine e-Mail Adresse verschickt. Für die gesamte Webseite können jedoch beliebig viele e-Mail Adressen hinterlegt werden, aus denen für jedes eingebundene Formular eine Adresse ausgewählt werden kann. Die Steuerung des Backends erfolgt über TYPO3 FlexForms.

Auswahl e-Mail Adresse für Empfänger

Referenz Thomas Berscheid Kontaktformular mehrere Adressen Fehlerprüfung TYPO3 Extension Template CSS TypoScript TS CSS HTML Programmierung Köln

Das Plugin bietet die Möglichkeit, aus den bereitgestellten e-Mail Adressen eine als Empfänger der e-Mail auszuwählen.

Einbindung in Webseite über den Erweiterungsmanager

Referenz Thomas Berscheid Kontaktformular mehrere Adressen Fehlerprüfung TYPO3 Extension Template CSS TypoScript TS CSS HTML Programmierung Köln

Das Kontaktformular ist als Extension für TYPO3 programmiert und kommt in mehreren Webseiten der Agentur zum Einsatz.

Eigenes Wiki für unsere Agentur
Thomas Berscheid ‣ 25.09.2018, 10:44:00
Die Internetagentur Irma Berscheid-Kimeridze hat ein eigenes Wiki. Codeschnipsel für TypoScript, Templates, JavaScript, jQuery und CSS.
Freie SSL-Zertifikate für unsere Webseiten
Thomas Berscheid ‣ 24.09.2018, 11:59:00
Let's encrypt bietet freie Zertifikate. SSL-Zertifikate auf Webserver installieren. Einbindung im Dauerauftrag.
Zukunft mit unseren Extensions für neue TYPO3 Version 9
Thomas Berscheid ‣ 19.09.2018, 11:09:00
Extensions auf neuesten Stand gebracht: Datenbank nun mit Doctrine QueryBuilder angebunden.
Provider Extensions für alle TYPO3 Webseiten
Thomas Berscheid ‣ 13.08.2018, 12:47:00
Agenturseite und Georgisch.Com auf TYPO3 upgedated. Beide und Georgienseite mit Provider Extensions.
TYPO3: Wir geben acht auf die Georgienseite
Thomas Berscheid ‣ 27.06.2017, 02:00:00
Im Frühjahr 2017 haben wir sehr viel Arbeit in den Relaunch der Georgienseite gesteckt. Nach 17 Jahren war es Zeit für eine Generalüberholung.
^