Wie erstellt man einen Kontaktformular in HTML

In diesem Tutorial wollen wir Ihnen zeigen, wie erstellt man ein leichtes Kontaktformular fur HTML-basierte Website Template.

Zuerst erstellen Sie 2 Dateien: contact_form.html und contact.php. In der ersten Datei gibt es HTML-Code fur das Formular und die zweite verarbeitet die Daten aus dem Formular

HTML

Unten ist der HTML-Code des Kontaktformulars

<form action="contact.php" method="post">
	Your name

    <input type="text" name="cf_name">

	Your e-mail

    <input type="text" name="cf_email">

	Message

    <textarea name="cf_message">

	<input type="submit" value="Send">
	<input type="reset" value="Clear">
</form>

Und hier ist wie das im Browser aussehen konnte

So sehen die wichtigen Aspekte aus. Das <form (Formular)> Tag soll 2 zusatzliche Attribute haben:

action=”contact.php” – Dieses Attribut gibt an, wohin die vorgelegten Daten aus den Kontaktformular Felder schicken lassen

method=”post” – Dieses Attribut gibt an, wie Daten aus dem Formular an die Datei, die im actionAttribut ist, schicken lassen. Die <input> und <textarea> Tags sollen ein Attribute “Name” mit einem eindeutigen Identifizier haben. Man benutzt dieses Attribut um die Formulardaten, die schon im Server vorgeschlagen werden, zu identifizieren. Und 2 Eingabeelementen, die man als Submit und Clear Buttons benutzt, eine soll das Typ=”submit” und andere das Typ=”reset” haben”

Grundsatzlich, das ist alles. Ganz einfach!

PHP

Jetzt fur die contact.php Datei, die tatsachlich die Daten aus den Feldern greifen, zu einer Nachricht komponieren und an Ihre E-Mail senden. Laden Sie die Datei contact.php aus dieses Link. Unten ist der Code von die Date mit den Kommentaren fur ihre wichtigen Hauptabschnitte.

Zuordnung von Daten, die aus Felder des Komtaktfolmulars gesendet werden, zu PHP-Variablen ($cf_message, $field_email, $field_message)

$field_name = $_POST['cf_name'];
$field_email = $_POST['cf_email'];
$field_message = $_POST['cf_message'];

$mail_to muss die E-Mail der Websitebesitzer, das ist der Platz wohin die Mail zugestellt werden soll, enthalten. Die mehrere E-Mails konnen durch Kommas getrennt angegeben werden (z.B. mail-one@template-help.com, mail-two@template-help.com)

$mail_to = 'test@test-mail.com';

Der Betreff der E-Mail bekommen Sie aus den Kontaktfolmular

$subject = 'Message from a site visitor ' . $field_name;

Den Body der E-Mail bauen Sie auf wie folgt:

$body_message = 'From: '.$field_name."\n";
$body_message .= 'E-mail: '.$field_email."\n";
$body_message .= 'Message: '.$field_message;

Den E-Mail Header bauen Sie auf wie folgt:

$body_message = 'From: '.$field_name."\n";
$body_message .= 'E-mail: '.$field_email."\n";
$body_message .= 'Message: '.$field_message;

Die Definierung der Mail-Funktion() und Zuordnen die zum variablen $mail_status, der man benutzt um zu prufen, ob die Mail geliefert oder nicht geliefert wird

$mail_status = mail($mail_to, $subject, $body_message, $headers);

Fur den erfolgreiche E-Mail-Funktion gibt es den folgenden Code

if ($mail_status) { ?>
	<script language="javascript" type="text/javascript">
		// Print a message
		alert('Vielen Dank fur Ihre Nachricht. Wir werden Sie umgehend kontaktieren.');
		// Redirect to some page of the site. You can also specify full URL, e.g. http://template-help.com
		window.location = 'contact_page.html';
	</script>
<?php
}

Wenn die E-Mail-Funktion ausfallt, gibt es den folgenden Code

else { ?>
	<script language="javascript" type="text/javascript">
		// Print a message
		alert(' Senden der Nachricht fehlgeschlagen. Bitte, senden Sie die E-mail an gordon@template-help.com');
		// Redirect to some page of the site. You can also specify full URL, e.g. http://template-help.com
		window.location = 'contact_page.html';
	</script>
<?php
}?>

Laden Sie die kompilierten Dateien contact_form.html und contact.php als Gesamtpaket herunter (single package)

.

 

Folgen Sie bitte den Anweisungen in unserem Tutorial wie man die Felder im Kontaktfolmular hinzufugt ( Wie fugt man Felder zu Kontaktformular hinzu )