Kontaktformular mit FormBuilder

Auf fast jeder Website wird die Möglichkeit geboten Kontakt zum Webmaster, also zu Dir, aufzunehmen. Hierzu kannst Du entweder Deine E-Mail angeben, was aber wegen Spam keine gute Idee ist, oder Du integrierst ein Kontaktformular auf Deiner Website. In ein Kontaktformular kann der Benutzer Deines Internet Projektes seine Adressangaben inklusive der E-Mail eingeben, den Grund der Kontaktaufnahme schreiben und mittels ’Klick’ an Dich senden. Die Formularinhalte werden an Deine E-Mail Adresse gesendet, die E-Mail Adresse bleibt dabei im Verborgenen und kann von niemand gesehen werden – somit ist dies ein hervorragender Schutz gegen Spam. Ein solches Kontaktformular lässt sich schnell und einfach mit dem CMS Made Simple Modul FormBuilder erstellen. Dieses AddOn FormBuilder ist sehr mächtig und hilft Dir alle denkbaren Formulare zu erstellen.

 

Eigenschaften des Moduls FormBuilder

  • Erstellen und editieren von einem oder mehreren Formularen auf der Website
  • Optionales Anti-Spam-Feature, das den E-Mail Versand auf 10 Stück pro IP und Stunde limitiertErstelle
  • Standard-Eingabefelder (Text, Checkbox, Drop-Down, Datum, Datei Upload, etc.)
  • Erstelle E-Mail spezifische Felder wie „Betreff“ oder die Überprüfung der Gültigkeit der E-Mail Adresse
  • Erstelle vordefinierte Felder mit Ländern oder Städtenamen
  • Lange Formulare über mehrere Seiten
  • Wahlweise speichern der Formulardaten in einer Datenbank, einem Textdokument oder als Versand einer E-Mail
  • Export- und Importfunktion für die Einstellungen, um sie auf anderen Websites nutzen zu können
  • u.v.m.

 

Live Beispiele

Standard Kontaktformular, mit CMS Made Simple erstellt

Beispiel fuer den Einsatz eines Standard Kontaktformulars in CMS Made Simple - Jens Hauschildt

 

Individuelle, mit CMS Made Simple erstellte Kontaktformulare

Beispiel fuer den Einsatz eines an den Kundenwunsch angepassten Kontaktformulars in CMS Made Simple - Jens Hauschildt Beispiel fuer den Einsatz eines an den Kundenwunsch angepassten Kontaktformulars in CMS Made Simple - Jens Hauschildt Beispiel fuer den Einsatz eines an den Kundenwunsch angepassten Kontaktformulars in CMS Made Simple - Jens Hauschildt

 

Um das Modul FormBuilder zu installieren, gehe in das AdminPanel in den Bereich Erweiterungen --> ModulManager und wähle hier den Buchstaben „F“ in der Liste der verfügbaren Module aus. Klicke in der Zeile, in der der FormBuilder aufgeführt ist, auf den Link Herunterladen und Installieren, das Modul wird in diesem Moment erfolgreich installiert.

Nach der Installation ist der FormBuilder im Menu Erweiterungen eingetragen. Wir finden hier bereits 2 Beispielformulare, die standardmäßig vorhanden und einsetzbar sind. Das erste ist das Kontaktformular, das auch in dem Beispiel oben eingesetzt wird. In der Spalte Formular-Alias findest Du den Tag, den Code, mit dem Du das Standard Kontaktformular in Deine eigene Website integrieren kannst.

Erstelle hierzu einen neue Inhaltsseite (Inhalte --> Seiten, Klick auf „neue Seite Hinzufügen“). Gebe als Titel der Seite und als Menütext „Kontaktformular“ oder etwas anderes, was Deinem Bedarf eher entspricht, ein. Schreibe in das Content-Feld:

{cms_module module='FormBuilder' form='contact'}

Klicke auf “Absenden”. Kontrolliere das Aussehen der neuen Seite in Deinem Internet Browser.

Es stehen zwar die wichtigsten Angaben in dem Formular, aber es besitzt keinesfalls ein Layout. Dies wird nun geändert. Ein Stylesheet wurde automatisch mit dem Modul FormBuilder mitinstalliert. Dieses müssen wir mit dem Template verbinden, um unser Kontaktformular in ein geeignetes Layout einzubetten. Öffne Inhalt --> Seiten und klicke in der Zeile mit Deiner Seite „Kontaktformular“ auf den Namen des Templates in der Spalte „Template“. Das Template öffnet sich. Klicke nun auf das blaue CSS-Icon neben dem Button „Zwischenspeichern“. Auf der sich öffnenden Seite wähle „FormBuilder Default Style" aus dem DropDown Menü und bestätige die Auswahl mit einem Klick auf den Button „Neues Stylesheet hinzufügen“. Das Stylesheet ist nun der Tabelle hinzugefügt und mit dem Template verknüpft. Kontrolliere das Ergebnis in Deinem Internet Browser. Jetzt sollte es gut aussehen, oder?

 

Kontaktformular anpassen

Wenn Du den Button „Submit Form“ unterhalb des Kontaktformulars drückst, wirst Du auf die Bestätigungsseite geleitet, auf der steht, dass Dein Formular gesendet wurde. Aber an welche E-Mail Adresse? Und was ist mit den Pflichtangaben in dem Formular – es funktioniert ja auch ohne die? Also müssen wir das Kontaktformular anpassen, bevor es tatsächlich auf der Website im Internet einsetzbar ist.

Klicke dazu im AdminPanel auf Erweiterungen --> FormBuilder und dann auf „Contact Form“ in der Spalte Formulare. Die Komplexität des Admin-Bereiches des FormBuilders lässt uns bereits jetzt erahnen, wie mächtig dieses Modul ist und dass es nicht möglich ist, an dieser Stelle alle Einstellungen zu erklären. Somit setzten wir uns als Ziel dieses Kapitels, dass das Kontaktformular an unsere eigene E-Mail geleitet werden soll.

Beginnen wir – klicke hierzu im Bereich „Formularfelder“ auf den Link „Send To:“, den Du in der ersten Spalte findest.

E-Mail im Modul FormBuilder in CMS Made Simple einstellen - Jens Hauschildt

Es sind nun 4 Felder anzupassen.

individuelles Anpassen der Formularangaben im Modul FormBuilder in CMS Made Simple - Jens Hauschildt

 

1. Gebe in das Feld „Betreff-Zeile der E-Mail“ den Text ein, den die E-Mail, die das Kontaktformular versendet, stehen soll, z.B. „Nachricht vom Kontaktformular“, ggf. gefolgt von einem Smarty tag, der das aktuelle Datum anzeigt

2. Gebe in das Feld „Von (Name) der Email“ den Absendernamen, so z.B. den Projektnamen meine-domain.de oder die Bezeichnung des Unternehmens ein

3. In das Feld „Von (Email Adresse) der Email“ ist eine gültige E-Mail Adresse einzutragen, die auch im Modul CMSMailer bestätigt sein muss. Teilweise wenn man über einen eigenen Server verfügt und kein Shared Hosting Paket hat, funktioniert der Mailversand auch, wenn keine Abstimmung mit dem CMSMailer vorgenommen wurde.

4. Gebe in das Feld „Ziel-Emailadresse“ die E-Mail Adresse ein, an die das die Inhalte des Kontaktformulars gesendet werden sollen.

Klicke auf „Aktualisieren“. Wechsle nun auf Deine Webseite im Internet Browser und überprüfe dort die Funktion des Kontaktformulars. Fülle es aus und sende es ab. Bereits nach kurzer zeit solltest Du in Deinem E-Mail Postfach eine neue Benachrichtigung haben. Falls es nicht funktioniert, lese Dir die Fehlerbeschreibungen noch einmal durch.

 

Pflichtfelder für das Kontaktformular

Die meisten Formulare besitzen zwei Arten von Feldern. Die, in die die Pflichtangaben eingetragen werden müssen – dies sind meistens der Name, die E-Mail Adresse und natürlich der Grund der Kontaktaufnahmen. Darüber hinaus gibt es in den häufig freiwillige Angaben, wie z.B. die Anschrift oder Telefonnummer. Welches in unserem Kontaktformular nun die Pflichtangaben und welche die freiwilligen Angaben sind, können wir in der Spalte „Pflichtfeld“ bestimmen. Der grüne Haken bedeutet, dass es sich um ein Pflichtfeld handelt, das rote Kreuz weist auf eine freiwillige Angabe hin. Ändern kannst Du die Einstellung, indem Du auf das entsprechende Symbol klickst, es ändert sich danach in das gegenteilige.

definieren der Pflichtfelder im Kontaktformular des Moduls FormBuilder in CMS Made Simple - Jens Hauschildt

 

Tipps

Um den roten Rahmen, der das gesamte Kontaktformular umgibt, zu entfernen, lösche die Einträge "Contact Fieldset“ und "fieldset end" aus der Tabelle in der Rubrik „Formularfelder“ heraus.

Um sicherzustellen, dass zumindest die Form der durch den Benutzer eingegebenen E-Mail Adresse gültig ist, klicke in der Tabelle auf „Your Email Address“ und wähle in dem DropDown Menü „Feld-Überprüfung:“ den Eintrag „Email Adresse“ aus.

Wähle in dem DropDown Menü „Dem Benutzer eine Kopie des Formulars schicken?:“ den Eintrag „Niemals“ aus, um zu verhindern, dass der Benutzer des Kontaktformulars eine Kopie der Nachricht erhält – diese enthält ebenfalls Deine E-Mail Adresse. Die Weitergabe Deiner E-Mail Adresse kann zu unerwünschtem Mailverkehr und ggf. auch Spam führen.

Da auch ein Kontaktformular verspamt werden kann, empfehle ich Dir, es durch ein Captcha zu schützen. Wechsle hierzu in Erweiterungen --> FormBuilder und klicke auf „ContactForm“. Wechsle in den Reiter „Captcha-Einstellungen“ und aktiviere hier die Checkbox „Dem Benutzer eine Kopie des Formulars schicken?:“. Das Modul Captcha muss natürlich vorher installier worden sein.