PHP Kontakt Formular mit UTF-8 als Email verschicken (jQuery powered)

Demos & Tutorials | 6 Kommentare | Tags: Captcha, Contact, Form, jQuery, php, UTF-8, Validation

19.10.2010

Nach langer Sommerpause mal wieder was nützliches.
Hier geht es jetzt darum ein Formular per PHP als Email zu verschicken. Da sich im Web der UTF-8 Zeichensatz immer mehr als Standard durchsetzt, kommt es beim Benutzen der PHP mail() Funktion zu einigen unschönen Ausgabeproblemen der Umlaute und Sonderzeichen. Im Internet stößt man auf die abenteuerlichsten Lösungen, die auch alle ihre Berechtigung haben. Die hier gezeigte Lösung soll zu einem schnellen Ergebnis führen und dabei auch für den weniger PHP begabten Nutzer nachvollziehbar sein. Also kurz ein Formular erstellt.

HTML Code


<form id="form" action="form2email.php" method="post">
<label for="name">Name</label>
<input id="name" name="name" size="25" type="text" />
<label for="email">Email</label>
<input id="email" name="email" size="25" type="text" />
<label for="betreff">Betreff</label>
<input id="betreff" name="betreff" size="25" type="text" />
<label for="nachricht">Nachricht</label>
<textarea id="nachricht" cols="50" rows="6" name="nachricht"></textarea>
<input id="submit" name="submit" type="submit" value="Formular senden" />
</form>

PHP Code

// Ausführen wenn Formular gesendet
if (isset($_POST["submit"]))
{

// Sammeln der Formulardaten
$an = "meine@email.de";
$name = $_POST['name'];
$email = $_POST['email'];
$betreff = $_POST['betreff'];
$nachricht = $_POST['nachricht'];

// Mailheader UTF-8 fähig machen
$mail_header = 'From:' . $email . "\n";
$mail_header .= 'Content-type: text/plain; charset=UTF-8' . "\r\n";

// Nachrichtenlayout erstellen
$message = "
Name: 		$name\n
Email: 		$email\n
Nachricht: 	$nachricht\n
";

// Verschicken der Mail
mail($an, $betreff, $message, $mail_header );
};

Hinweis

Der gezeigte Code löst das Umlautproblem durch Erweiterung des Mailheaders, mehr nicht. Ein schickes Webformular sollte natürlich mehr bieten. Als erstes gehört eine Validierung der Eingaben in das Formular. Dazu gibt es schicke auf jQuery basierende Javascript Lösungen. Hier ein Fundstück mit jQuery Formular-Validierungs-Plugins. Um sich vor Spammern zu schützen sollte man auch noch ein Captcha nutzen. Mein Favorit ist eindeutig das jQuery – s3Captcha.

Im Demo könnt ihr das Kontaktformular als Komplettpaket sehen, sprich mit Validierung und Captcha. Das Download Paket enthält neben der oben im Code gezeigten Variante auch dieses “ready to use” Komplettpaket. Wie immer gilt…bei Fragen fragen!

Demo Download

493 mal runtergeladen

Hinweis in eigener Sache!
Das Script ist meine persönliche Lösung, ich erhebe keinen Anspruch darauf, dass diese auch die Beste ist. Änderungen, Verbesserungen und Optimierungen am Script sind ausdrücklich erlaubt. Die Benutzung des Scriptes erfolgt auf eigene Gefahr. Für eventuelle Schäden, die durch den Einsatz bzw. die Nutzung des Scriptes entstehen, übernehme ich keine Haftung.

6 Kommentare

Stany
November 17th, 2010 on 23:06

Ein echt gutes Kontakt Formular, sehr einfach zu bedienen und nur zu empfehlen. Vielen Dank an Rico
toxi
Dezember 15th, 2010 on 21:35

oha danke funktioniert auch super
Ben
Februar 24th, 2011 on 19:19

Echt genial – das is schon ne ideal Lösung von einem Kontaktformular!
Vielen Dank.
basteln
April 4th, 2011 on 06:04

hallo, kann mir einer sagen, was ich falsch mache?
http://s7.directupload.net/images/110404/zckdg3um.jpg

danke =)
basteln
April 4th, 2011 on 06:48

habs hinbekommen =) danke für das script!
Knut
Oktober 24th, 2011 on 10:18

Ein Problem mit grafischen Captchas ist leider, dass die Seite dadurch nicht mehr barrierefrei ist. Hier sind Captchas besser, die Aufgaben wie “3+5=?” stellen. Außerdem lassen sich textbasierte Captchas auch leichter lokalisieren (l12n).