Joomla! 2.5 (Teil 23): Ein Kontaktformular mit DFContact

Natürlich kann man mit Joomla!-Bordmitteln ein Kontaktformular anlegen. Allerdings stößt man mit diesem Formular früher oder später an seine Grenzen. Hier helfen dann Formular-Extensions weiter. Eine davon ist DFContact. Dabei handelt es sich um eine vergleichsweise einfache Formular-Extensions, die aber durchaus ihren Zweck erfüllt. In diesem Tutorial wird gezeigt, was es mit DFContact auf sich hat, wie man es installiert und konfiguriert. Zu guter Letzt geht es dann darum, auf welche Art ihr die Extension mit einem effektiven Spam-Schutz ausstatten könnt.

Wir empfehlen:
Joomla!-Training

Bei DFContact handelt es sich um eine einfach zu handhabende Formular-Erweiterung, die von der Seite http://www.software.filzhut.de/ kostenlos heruntergeladen werden kann. Bevor gezeigt wird, wie sich DFContact nutzen lässt, ein Blick darauf, was diese Extension eigentlich leistet. Auf den folgenden beiden Seiten könnt ihr euch einen ersten Eindruck davon verschaffen, welche Art von Formular mit DFContact angelegt werden kann.

• BUND – http://www.bundjugend.de/kontakt/kontaktformular/
• Verkehrswacht Baden-Württemberg – http://www.verkehrswacht-bw.de/kontakt/

Wenn ihr DFContact einsetzen wollt, ruft ihr Erweiterungen>Erweiterungen auf. Über die Datei-auswählen-Schaltfläche wird das heruntergeladene Zip-Archiv ausgewählt. Mit Hochladen & installieren installiert man die Erweiterung.

Nach erfolgreicher Installation gibt es im Komponenten-Menü den neuen Eintrag dfcontact. Darüber erreicht man alle relevanten Optionen, die für die Konfiguration des Formulars benötigt werden.

 

Die Konfiguration geschieht über die einzelnen Registerkarten. Aufgrund der guten Dokumentation der Extension müssen an dieser Stelle nicht alle Optionen explizit erklärt werden. Denn neben den Optionen werden jeweils detaillierte Erklärungstexte angezeigt.

 

Üblicherweise beginnt man mit der Konfiguration innerhalb des Allgemein-Registers.

 

Dort wird zunächst einmal bestimmt, wohin die Formulardaten nach dem Absenden geschickt werden sollen. Tragt in das Feld Ziel E-Mails die gewünschte Adresse ein. Bei Bedarf könnt ihr dort übrigens auch mehrere Adressen notieren. Dabei müssen die einzelnen Adressen dann durch Kommata voneinander getrennt werden.

info@psd-tutorials.de, kontakt@medienwerke.de

Eine E-Mail-Adresse muss in jedem Fall angegeben werden. Fehlt diese, gibt es im Frontend eine Fehlermeldung.

 

Über die Option HTML-E-Mails kann man festlegen, ob die E-Mails im HTML-Format versandt werden sollen.

Festgelegt werden kann außerdem, ob die Erweiterung Daten sammelt.

 

Wird die Option Server-Daten auf Ja gestellt, bekommt ihr zusätzlich zu den eigentlichen Formulardaten auch die folgenden Informationen zugeschickt:

• verwendetes Betriebssystem
• den eingesetzten Browser
• die IP-Adresse

Die Benutzer erfahren von dieser Datensammlung nichts. Dennoch bzw. gerade deshalb solltet ihr sie aber natürlich darüber aufklären, dass ihr diese Daten einholt.

Weitere interessante Optionen gibt es in den Bereichen Sicherheit und Captcha.

Klickbare Links – Diese Option solltet ihr deaktivieren. Das ist ein erster Schritt in Sachen Spam-Schutz.
Online Status – Wenn ihr einen Messenger benutzt, wird dessen Status angezeigt. Normalerweise sollte man diese Option auf Nein setzen.
Captcha – Dadurch kann man die Captcha-Funktion aktivieren. Was es mit der auf sich hat, wird noch ausführlich beschrieben.

Über die Optionen im Bereich Layout lässt sich das Formular gestalten.

 

So könnt ihr dort beispielsweise den Seitentitel festlegen. Ebenso kann der Text angegeben werden, der vor dem eigentlichen Formular zu sehen sein soll. Beide Optionen lassen sich am besten anhand von Abbildungen zeigen. Werft dafür zunächst einen Blick auf die Backend-Einstellungen.

 

Auf Basis dieser Einstellungen sieht das Formular im Frontend dann folgendermaßen aus:

 

Weiter geht es mit dem Register Ihre Daten. Hier wird letztendlich das bestimmt, was oberhalb des Formulars zu sehen sein soll.

Dabei sind die Angaben optional, ihr müsst sie also nicht machen.

 

Die nächsten Einstellungen betreffen das Register Formular-Felder. In diesem Register könnt ihr Folgendes bestimmen:

• Welche Felder sollen angezeigt werden?
• Welche dieser Felder müssen vom Benutzer in jedem Fall ausgefüllt werden?

Angeboten werden u.a. die folgenden Feldtypen:

Nachricht
Checkbox
Firma
Anrede
Name
Position
Straße
Postfach
PLZ
Stadt
Bundesland
Land
Telefon
Handy
Fax
Email
AIM
Skype
ICQ
Yahoo
MSN
Nachricht

 

Was ihr hier einstellt, ist letztendlich natürlich Geschmackssache. In aller Regel sollte man aber zumindest die Felder

Name,
E-Mail und
Nachricht

abfragen. Die Felder, die im Frontend zu sehen sein sollen, müssen auf Anzeigen gestellt werden.

Außerdem kann man bestimmen, ob Felder optional ausgefüllt werden können, oder ob es sich um Pflichtfelder handelt. Solange im Frontend ein als Pflichtfeld deklariertes Feld nicht ausgefüllt wurde, lässt sich das Formular nicht abschicken.

 

Einen Menüeintrag setzen

Mit dem Anlegen des Formulars ist es natürlich noch nicht getan. Das Formular muss auch noch im Frontend verfügbar gemacht werden. Ruft dazu über Menüs das Menü auf, in das der neue Menüeintrag aufgenommen werden soll. In der Werkzeugleiste wird auf Neu geklickt. Als Menütyp wird DFContact gewählt.

Mit Speichern werden die Einstellungen übernommen.

 

Captcha einsetzen

Das Formular sollte mit einem Captcha gegen Spam abgesichert werden. Damit das Captcha überhaupt funktioniert, muss auf dem Server die GD Library, kurz GD oder GDlib, installiert sein. Diese Bibliothek ermöglicht die automatische Generierung und Manipulation von Grafiken. Und eben das ist Voraussetzung für ein Captcha.

Eine erstklassige Einführung in die GDlib, übrigens inklusive Installationsbeschreibung, gibt es unter http://macx.de/essays/gdlib/.

Unter Komponenten>DFContact im Register Allgemein im Bereich Sicherheit muss die Funktion Captcha auf reCaptcha gestellt werden.

 

Außerdem muss man einen privaten und einen öffentlichen Schlüssel angeben. Diese Schlüssel bekommt ihr hier kostenlos. Klickt dort auf die Schaltfläche USE reCaptcha ON YOUR SITE. Auf der nächsten Seite klickt man auf Sign up Now!. Jetzt muss nur noch der URL eurer/einer Seite angegeben werden. Mit Create Key werden beide Schlüssel generiert. Diese kopiert ihr am besten nacheinander in die Zwischenablage und fügt sie in die entsprechenden Felder innerhalb der DFContact-Konfiguration ein. Mehr ist tatsächlich nicht nötig, um das Captcha im Frontend anzuzeigen.

Ab sofort lässt sich das Formular nur dann verschicken, wenn exakt dieselbe Zeichenfolge in das Textfeld eingetragen wird wie die, die im Captcha zu sehen ist. Das garantiert zwar keinen 100-prozentigen Schutz vor Spam, es wird euch aber sehr zuverlässig vor Spam-Attacken schützen.

Wir empfehlen:
Dreamweaver-Video-Training

Unsere Empfehlung für dich

Joomla! für Einsteiger und Aufsteiger

Joomla! für Einsteiger und Aufsteiger

Was liegt wo und ist wie, mit welchem Inhalt verknüpft?! Nach diesem Kurs ist das keine Frage mehr! Mit Joomla! erstellst du Webseiten und behältst deren Inhalte jederzeit im kontrollierenden und koordinierenden Blick.

  • 28 Lektionen in über fünf Stunden Video-Training zum praktischen Umgang mit Joomla!
  • Lerne das CMS von Grund auf kennen und verwalte damit deine redaktionellen Webseiten-Inhalte
  • Praxisnah lernen: inklusive Arbeitsmaterialien zum Mitmachen und Nachvollziehen
  • Auf dem neuesten Stand: Optimiert für die aktuelle Joomla!-Version 3.6

Zum Training