Formulare

Aus DynPG-Wiki
Wechseln zu: Navigation, Suche

In DynPG können Sie auf einfache Weise Formulare erstellen und automatisch an eine E-Mailadresse senden lassen. In diesem Artikel erfahren Sie, wie das geht.

Formular erstellen

Formulare werden in DynPG über den Texteditor bzw. in der Ansicht zum Erstellen von Artikeln erzeugt. Klicken Sie hier auf den Formtable.gif "Formular einfügen"-Button um eine Tabelle mit Feldern für Formularelemente einzufügen. Anschließend können Sie über den Formular.gif "Formularelement einfügen"-Button Formularelemente hinzufügen.

Tip.png Tipp: Bevor Sie beginnen ein Formular zu erstellen, ist es empfehlenswert, zuerst die Artikel, welche bei erfolgreichem bzw. bei erfolglosem Versenden des Formulars angezeigt werden zu erstellen.

Formulartabelle einfügen

Formular Dialog.png


Im erscheinenden Popup-Fenster können Sie nun weitere Angaben machen.

  • Formularname
Hier können Sie den Namen für das Formular angeben. Dieser ist dann in der Betreffzeile der E-Mail zu lesen.
  • Formulardaten an folgende E-Mailadresse senden
Geben Sie hier die E-Mailadresse ein, an welche die Formulardaten gesendet werden sollen.
  • Senden war erfolgreich
Hier können Sie den Artikel auswählen, der angezeigt werden soll, wenn das Formular erfolgreich gesendet wurde.
  • Senden ergab Fehler
Hier können Sie den Artikel auswählen, der angezeigt werden soll, wenn das Senden des Formulars einen Fehler ergab. Mögliche Ursachen für den Aufruf dieses Artikels:
  • Der Kunde hat ein Feld, das als "Zwingend" (siehe Formularelemente) markiert ist, nicht ausgefüllt.
  • Der Kunde hat ein Feld, das als "E-Mail“ (siehe Formularelemente) markiert ist mit ungültigen Angaben bzw. gar nicht ausgefüllt.
  • Der Kunde hat das Formular bei diesem Besuch bereits gesendet.
  • Seite zwischenschalten
Hier können Sie eine Seite angeben, die während der Bearbeitung des Formulars angezeigt wird, bevor der Nutzer zur Erfolgs- bzw. Fehlerseite weitergeleitet wird.
  • Seite nicht im Workflow interbringen
legt fest, ob dieses Formular im Backend eingebracht werden soll.
  • Sprache
Spracheinstellung für das Formular.

Um die Daten zu bearbeiten, klicken Sie mit der Maus auf das untere "Form"-Bild. Wählen Sie nun die Schaltfläche „Formulartabelle einfügen/bearbeiten“ um das Popup zum Bearbeiten zu öffnen. Um die geänderten Daten zu übernehmen, drücken Sie den "Aktualisieren"-Button.

Caution.png Achtung: Vermeiden Sie das Kopieren von Formularfeldern innerhalb eines Formulares. Jedes Formularfeld erhält beim Erstellen eine eigene ID. Wird eine ID mehrfach verwendet, führt dies in verschiedenen Browsern dazu, dass ein Formular nicht versendet werden kann.

Formularelemente einfügen

Beachten Sie unbedingt, dass Sie die blauen Icons in der Tabelle an denselben Stellen belassen. Bei fehlenden Icons wird das Formular nicht mehr funktionieren.

Formular Beispiel.png


Um Formularelemente einzufügen, klicken Sie mit der Maus in eine Zelle der zuvor eingefügte Formulartabelle. Wählen Sie nun die Schaltfläche Formular.gif "Formularelement einfügen“. Daraufhin öffnet sich ein Popup-Fenster, in dem die verschiedenen Formularelemente aufgelistet werden.

Caution.png Achtung: Beim Einfügen einer Formulartabelle wird oben und unten je eine automatische Zeile mit einem Formularbild erstellt. Um Probleme zu vermeiden, ändern oder löschen Sie diese Zeile nicht. Sie soll Ihnen lediglich den Bereich anzeigen, in dem Sie Formularelemente platzieren können.

Allgemeine Einstellungen

Eigenschaften:

Tab. Index: Indexnummer die bestimmt, in welcher Reihenfolge die Formularelemente beim Durchschalten mit der Tabulatortaste angewählt werden.
Sperren: Ist diese Option aktiviert, so kann der Wert des Formularelements nicht mehr verändert werden.


Normaler Text

Da es sich beim Formular im Texteditor zunächst um eine normale Tabelle handelt, können Sie hier wie gewöhnt normalen Text und sogar Bilder etc. einfügen.


Textfeld

Formular Textfeld.png

Ein einzeiliges Eingabefeld, welches sich besonders für einzelne Wörter wie z.B. Name, Adresse usw. eignet.

Eigenschaften:

Feldname: Hier müssen Sie einen Namen für dieses Element angeben. Diesen Namen sehen Sie dann auch in der E-Mail eines gesendeten Formulars. Z.B. Feldname=Name --> ergibt in der E-Mail: Name:………………Hans Muster (eingegebener Name)
Value: Text, mit dem das Feld vorbelegt werden kann. Dies bedeutet aber auch, dass das Feld auch im Mail übertragen wird. Wenn hier kein Wert drin steht und das Formular ausgelöst wird, erscheint dieses Feld im Mail nicht.
Größe: Größe des Textfeldes.
Max. Länge: maximale Anzahl an Zeichen, die eingegeben werden dürfen.
Weiteres: Hier können Sie noch spezielle Optionen für diese Text Box wählen. Zwingend bedeutet, das Feld muss ausgefüllt werden, ansonsten wird die Fehlerseite aufgerufen. E-Mail bedeutet, dass dieses Feld eine E-Mailadresse enthalten muss. Das Feld wird beim Senden des Formulars geprüft. Bei E-Mail versenden wird zusätzlich eine Bestätigungs-E-mail an diese Adresse gesendet.

Passwortfeld

Formular Passwortfeld.png

Ähnlich einem Textfeld ist dies ein einzeiliges Eingabefeld mit der Besonderheit, dass die Eingabe mit Sternchen (*) ausgefüllt wird. In der E-Mail ist die Eingabe jedoch im Klartext lesbar.

Eigenschaften:

Feldname: Hier müssen Sie einen Namen für dieses Element angeben. Diesen Namen sehen Sie dann auch in der E-Mail eines gesendeten Formulars. Z.B. Feldname=Name --> ergibt in der E-Mail: Name:………………Hans Muster (eingegebener Name)
Value: Text, mit dem das Feld vorbelegt wird.
Größe: Größe des Textfeldes.
Max. Länge: maximale Anzahl an Zeichen, die eingegeben werden dürfen.
Zwingend: legt fest, ob das Feld ausgefüllt werden muss und ansonsten die Fehlerseite aufgerufen wird.


Textfeld (mehrzeilig)

Formular Textarea.png

Ein mehrzeiliges Eingabefeld, das sich besonders für längere Texte wie z.B. Mitteilungen, Wünsche usw. eignet.

Note.png Hinweis: Beim Einfügen eines mehrzeiligen Textfeldes wird nur ein Bild angezeigt. Dieses kann von den eingegebenen Angaben abweichen. Auf der Webseite wird es später jedoch korrekt dargestellt.

Eigenschaften:

Feldname: Hier müssen Sie einen Namen für dieses Element angeben. Diesen Namen sehen Sie dann auch in der EMail eines gesendeten Formulars. Z.B. Feldname: Mitteilung --> ergibt in der E-Mail: Mitteilung:………………Danke! Ich war sehr zufrieden.
Text: vordefinierter Text, der beim Aufruf des Formulars bereits im Textfeld steht.
Zeilen: Anzahl der Zeilen des Textfeldes.
Breite: Anzahl Zeichen pro Zeile angeben.
Zwingend: Ist diese Box ausgewählt, muss dieses Feld ausgefüllt werden, ansonsten wird die Fehlerseite aufgerufen.


Optionsfeld (Radio Button)

Formular Option.png

Eine Liste von Auswahlmöglichkeiten, bei der nur eine Option ausgewählt werden kann.

Eigenschaften:

Feldnamen: Hier müssen Sie einen Namen für dieses Element angeben. Diesen Namen sehen Sie dann auch in der E-Mail eines gesendeten Formulars.
Optionen zur Auswahl: Geben Sie hier die Anzahl der Auswahlmöglichkeiten an und klicken Sie auf "Weiter“. Danach können Sie einzelnen Optionen angeben


Kontrollfeld (Check-Box)

Formular Kontroll.png

Ähnlich wie Radio Button eine Liste von Auswahlmöglichkeiten, bei der mehrere Optionen ausgewählt werden können.

Eigenschaften:

Feldnamen: Hier müssen Sie einen Namen für dieses Element angeben. Diesen Namen sehen Sie dann auch in der E-Mail eines gesendeten Formulars.
Optionen zur Auswahl: Geben Sie hier die Anzahl der Auswahlmöglichkeiten an und klicken Sie auf "Weiter“. Danach können Sie einzelnen Optionen angeben


Dropdown-Liste

Formular Dropdown.png

Funktionell gleich zu einem Radio Button. Es werden verschiedene Auswahlmöglichkeiten in einer Dropdown-Liste angezeigt, wobei nur eine Option ausgewählt werden kann.

Eigenschaften:

Feldnamen: Hier müssen Sie einen Namen für dieses Element angeben. Diesen Namen sehen Sie dann auch in der E-Mail eines gesendeten Formulars.
Optionen zur Auswahl: Geben Sie hier die Anzahl der Auswahlmöglichkeiten an und klicken Sie auf "Weiter“. Danach können Sie einzelnen Optionen angeben


Absenden-Button

Formular Senden.png

Ein Button, der bei einem Klick das Formular Versenden des Formulars auslöst. Das Formular muss einen senden-Button enthalten, damit es versendet werden kann.

Eigenschaften:

Beschriftung: Hier können Sie die Beschriftung des Senden-Buttons festlegen.


Zurücksetzen-Button

Datei:Formular Zurücksetzen.png

Ein Button, der bei einem Klick alle Formularelemente wieder mit den Standardwerten belegt.

Eigenschaften:

Beschriftung: Hier können Sie die Beschriftung des Zurücksetzen-Buttons festlegen.

Editieren von Feldern

Wenn Sie ein Feld editieren möchten, markieren Sie dieses und klicken Sie auf die Schaltfläche Formular.gif "Formularelement bearbeiten".