Regionales Hochschulrechenzentrum Kaiserslautern-Landau

Kontaktformulare

mit der Erweiterung Powermail

Powermail

Powermail ist ein Plug-In, mit dem einfache Kontaktformulare bis hin zu komplexe, umfangreiche Formulare erstellt werden können. Die Formulare werden sowohl zentral erstellt als auch abgelegt und können dann mehrfach für Webseiten verwendet werden.

Das Plug-In bietet folgende Funktionen:

  • Einfaches Erstellen von Kontaktformularen
  • mehrfache Verwendung für Webseiten
  • einfachen Kontaktformularen bis hin zu komplexen Formularen
  • Erstellen verschiedener Feldtypen: Text, Checkbox, Upload-Feld, usw.
  • Definition von Pflichtfeldern
  • JavaScript Validation (auf z.B. E-Mail, URL, Zahlen, Buchstaben etc...)
  • Kontroll-Seite mit einer Zusammenfassung der eingegebenen Daten
  • Bestätigungs-Seite bei Durchführung der Anmeldung
  • Versand einer Bestätigungs-Email an den Absender
  • Versand einer E-Mail mit den Daten des Formulars an eine bestimmte E-Mail-Adresse

 

Nicht möglich damit ist

  • Daten aus eingesendeten Formularen zu exportieren. Es wird immer nur eine E-Mail gesendet.
  • Dateiupload beim Absenden des Formulars

Konzept Powermail

Zunächst wird ein Formulare-Ordner benötigt. Dies ist der Ort, an dem Formulare entworfen und gespeichert werden.

Diese Formulare können dann als Powermail-Plug-In auf beliebigen Seiten eingebunden werden.

 

Es wird das Konzept von Powermail-Formularen abgebildet. Es sind 4 Kästen abgebildet. im Linken oberen steht "Formulare-Ordner", rechts danebn "Ort an dem die Formulare gespeichert sind". Unten links steht Powermail-Plug-In, rechts daneben steht "Stellt die ZUsammenhänge her, zeigt die Inhalte auf der Webseite".
Konzept von Powermail-Formularen

Wichtig zu wissen!

Bei der Gestaltung von Kontaktformularen auf Ihrer Webseite müssen die Bestimmungen der Datenschutzgrundverordnung (DSGVO) beachtet werden. Beachten Sie insbesondere die Angaben in Teil 5 unserer Datenschutzerklärung. Hier werden ausschließlich simple Kontaktformulare mit Email-Adresse und Freitext besprochen.

Alle Formulare, die über die Angabe von Name, E-Mail und einem Freitext hinausgehen, benötigen eine gesonderte Datenschutzerklärung und müssen ggf. als Verfahren bei dem Datenschutzbeauftragten angemeldet werden.

Sollten Sie Fragen hierzu haben oder Hilfe benötigen, wenden Sie sich bitte an Ihre zuständigen Datenschutzkoordinator*innen aus zentralen Einrichtungen, Fachbereichen oder Verwaltung.

DS Koordinator*innen in Kaiserslautern: https://sharepoint.uni-kl.de/so/datenschutz-portal/SitePages/Datenschutz-Koordinierende.aspx
DS Ansprechperson in Landau (Stand 05/2023):  Dr. Susanne Weis susanne.weis(at)rptu.de 

Beispiel

Beispielelement aus dem Frontend: Es ist ein Formular dargestellt. Dieses Formular beinhaltet eine freie Zeile für den Namen, darunter für die E-Mailadresse und zuletzt ein Feld für Angaben. Rechts unten im Eck befindet sich ein Button zum Abschicken.
Beispielelement aus dem Frontend: Formular

Aufbau von Formularen

Es ist eine Abbildung zum Aufbau von Formularen dargestellt. Diese ist in 2 Teile unterteilt, links und rechts eine Seite. Innerhalb der linken Seite befinden sich fünf Felder, welche untereinander liegen.
Abbildung zum Aufbau von Formularen

Formulare erstellen

1. Anlegen eines Ordners im Seitenbaum: Dies ist der zentrale Ort, an dem alle Formulare abgelegt werden. Formulare, die in diesem Ordner abgespeichert werden, können auf beliebig vielen Seiten eingebunden werden.

Beispielelement aus dem Typo3 Backend: Es sind die Modulleiste und der Seitenbaum abgebildet. Das Modul Seite ist ausgewählt. Im Seitenbaum ist der Ordner Formulare hervorgehoben.
Beispielelement aus dem Typo3 Backend: Ordner Formulare

4. Bezeichnung für das Formular eingeben und auf "Seiten neu erstellen" gehen. (Es können auch mehrseitige Formulare erstellt werden.)

Beispielelement aus dem Typo3 Backend: Es ist ein Teil der Bearbeitungsleiste abgebildet. Unter dem Reiter Allgemein ist das Feld Bezeichnung unter darunter +Seite neu erstellen hervorgehoben.
Beispielelement aus dem Typo3 Backend: Formular-Bezeichnung eingeben und Formular-Seite neu erstellen

5. Bezeichnung für die Seite angeben. Unter dem Tab „Zugriff“ können Sie das Formular zeitgesteuert veröffentlichen. (Anfangsdatum/Enddatum)

Dann "Felder neu erstellen" auswählen. Dies sind die Eingabefelder, die der Besucher später zu sehen bekommt.

Beispielelement aus dem Typo3 Backend: Es ist ein Teil der Bearbeitungsleiste abgebildet. Unter dem Reiter Allgemein ist das Feld Bezeichnung unter darunter +Felder neu erstellen hervorgehoben.
Beispielelement aus dem Typo3 Backend: Seiten-Bezeichnung eingeben und Formular-Felder neu erstellen

7. Folgende Felder sollten angelegt werden: 

  • Name (Textfeld) - Namensübermittelung anhaken / Reiter Erweitert: Pflichtfeld
  • E-Mail (Textfeld) - E-Mail-Übermittelung anhaken / Reiter Erweitert: Pflichtfeld
  • Anliegen (Textfeld mehrzeilig)
  • Absenden (Abschicken Feld)

2. Wechseln Sie zur Listenansicht (Web-Modul: Liste) und legen Sie einen neuen Datensatz an (im Seitenbaum ist weiterhin der zentrale Ordner ausgewählt)

Beispielelement aus dem Typo3 Backend: Es sind die Modulleiste, der Seitenbaum und die Bearbeitungsleiste abgebildet. Das Modul Liste ist ausgewählt. In der Bearbeitungsleiste ist das + Symbol hervorgehoben und mit dem Mauszeiger angewählt.
Beispielelement aus dem Typo3 Backend: Datensatz erstellen

3. Im Bereich Powermail "Formulare" auswählen.

Beispielelement aus dem Typo3 Backend: Es sind Optionen zum Erstellen eines neuen Datensatzes abgebildet. Hervorgehoben wird im unteren Bereich "Formulare".
Beispielelement aus dem Typo3 Backend: Neuer Datensatz "Formulare"

6. Geben Sie die Bezeichnungen für das Feld an, z.B. Name. Fügen Sie weitere Felder hinzu und wählen Sie die gewünschte Bezeichnung aus, z.B. E-Mail, ich nehme teil, Absende-Schaltfläche, bis ihr Formular alle benötigten Felder enthält.
Unter dem Tab „Erweitert“ können Sie auswählen, ob das Feld ein Pflichtfeld sein soll und vom Absender ausgefüllt werden muss oder nicht. Geben Sie eine Beschreibung für das Feld an, welche im Frontend angezeigt wird.

Beispielelement aus dem Typo3 Backend: Es ist ein Teil der Bearbeitungsleiste abgebildet. Unter dem Reiter Allgemein ist das Feld Bezeichnung hervorgehoben. Ebenso sind die Tabs Erweitert und Zugriff rechts neben Allgemein hervorgehoben.
Beispielelement aus dem Typo3 Backend: Feld-Bezeichnung eingeben und weitere Optionen
Beispielelement aus dem Typo3 Backend: Ein Drop-Down-Menü ist abgebildet. Ausgewählt ist die Option "Textfeld (Input)".
Beispielelement aus dem Typo3 Backend: Typ des Feldes: "Textfeld (Input)".

8. Wählen Sie den Typ des Feldes aus. Die Auswahl des Typs bestimmt das Erscheinungsbild des Feldes. Folgende Typen stehen zur Auswahl:

Standard
Textfeld: der Absender hat eine Zeile zur Verfügung, um Angaben zu machen
Textfeld mehrzeilig: hier kann der Absender einen Text eingeben
Auswahlfeld: der Anwender kann verschiedene Optionen auswählen, die Sie unter „Optionen“ auflisten
Mehrfachauswahl/Checkbox: ist ein ankreuzbares Kontrollfeld, bei denen der Anwender ein Häkchen setzen kann
Einfachauswahl/Radiobutton: der Anwender kann eine Box auswählen
Abschicken Feld/Submit: nach dem Klick auf die Absenden-Schaltfläche wird das Formular übermittelt

Erweitert
Zurücksetzen: alle Felder, die der Anwender aufgefüllt hat, können hiermit zurückgesetzt werden
Passwort-Feld: als Spamschutz können Sie das Passwort-Feld nutzen
Datei Upload: Hiermit kann der Anwender eine Datei von seinem lokalen Rechner zusammen mit dem Formular übertragen (Upload)

Formulare im Frontend verwenden

Jetzt könen Formulare als Powermail-Plug-In auf beliebigen Seiten eingebunden werden.

9. Wechseln Sie zum Modul Seite und wählen Sie im Seitenbaum die Seite aus, in der das Formular integriert werden soll.

Beispielelement aus dem Typo3 Backend: Es sind die Modulleiste, der Seitenbaum und die Bearbeitungsleiste abgebildet. Das Modul Seite ist ausgewählt. Im Seitenbaum ist die Seite Formulare hervorgehoben. In der Bearbeitungsleiste ist der Button "Inhalte hinzufügen" umrahmt.
Beispielelement aus dem Typo3 Backend: Hinzufügen eines Formulars auf einer Seite

11. Vergeben Sie eine Überschrift für das Formular.

Beispielelement aus dem Typo3 Backend: Es ist ein Teil der Bearbeitungsleiste abgebildet. Unter dem Reiter Allgemein ist das Feld Überschrift umrahmt.
Beispielelement aus dem Typo3 Backend: Formular-Überschrift

13. Tab Empfänger: Geben Sie den Namen und die E-Mail des Empfängers ein.

Wichtig: Geben Sie einen Betreff der E-Mail an, sonst wird der E-Mailversand deaktiviert!

Beispielelement aus dem Typo3 Backend: Es ist ein Teil der Bearbeitungsleiste abgebildet. Unter dem Reiter Empfänger befinden sie Hervorhebungen der Felder des Namens, der E-Mail Adresse und der Betreff der E-Mail des Empfängers.
Beispielelement aus dem Typo3 Backend: Namen, E-Mail Adresse und Betreff der E-Mail des Empfängers

Beispiel für eine Antwortseite.

Beispielelement aus dem Frontend: Es ist ein Beispiel für eine Antwortseite abgebildet.
Beispielelement aus dem Frontend: Beispiel für eine Antwortseite

10. Legen Sie ein neues Inhaltselement an. Wählen Sie dazu das Tab Plug-Ins aus und dann Powermail.

Beispielelement aus dem Typo3 Backend: Es sind die verschiedenen Optionen zum Hinzufügen eines Inhaltselements abgebildet. Unter Plug-Ins ist die Option Powermail hervorgehoben.
Beispielelement aus dem Typo3 Backend: Plug-In Powermail

12. Unter dem Tab Plug-In können Sie alle relevanten Einstellungen für das Formular angeben.
Tab Einstellungen: Wählen Sie das Powermail Formular aus, dass Sie bereits angelegt und im Ordner abgelegt haben. Außerdem können Sie eine Bestätigungsseite aktivieren (Absender kann seine Angaben vor dem Absenden noch mal überprüfen), eine E-Mail Bestätigung, ein Mehrschrittformular aktivieren und ein Ort definieren, wo die Mails gespeichert werden sollen.

Beispielelement aus dem Typo3 Backend: Es ist ein Teil der Bearbeitungsleiste abgebildet. Unter dem Reiter Einstellungen ist ein Drop-Down-Menü hervorgehoben. Es wurde ein "Mein erstes Formular" ausgewählt. Zudem weißen Pfeile darunter auf drei Kästchen hin. Das Kästchen Bestätigungsseite aktivieren ist ausgefüllt.
Beispielelement aus dem Typo3 Backend: Formulareinstellungen

14. Tab Antwortseite: Geben Sie einen Text ein, der dann auf der Antwortseite erscheint. Die Antwortseite erscheint bei dem Benutzer nach dem Abenden des Formulars.

Beispielelement aus dem Typo3 Backend: Es ist ein Teil der Bearbeitungsleiste abgebildet. Unter dem Reiter Antwortseite ist das Textfeld hervorgehoben, in welches der Text der Antwortseite zu schreiben ist.
Beispielelement aus dem Typo3 Backend: Text der Antwortseite

Sie befinden sich in der Selbstschulung und möchten zur Schulungsstartseite, dann klicken Sie auf  TYPO3 im Selbststudium für Einsteiger Teil 3.

Sie befinden sich gerade in der Selbstschulung 3, dann klicken Sie auf Übung - Powermail-Formulare, um damit fortzufahren.

Übung - Formulare erstellen
Weiterlesen