Kontakt Postkarte

Scripte > Form-Mailer

Kontaktformular im Postkarten-Style

Dieses Script versendet eine E-Mail-Nachricht im Postkarten-Style.
Die E-Mail-Postkarte besitzt eine Vorder- und Rückseite, wo die Bild-Dateien entsprechend ausgetauscht werden können. Jeweils beim klick auf das Bild (Rückseite auf Porto), wird die Karte umgedreht. Die Prüfung und Fehlerausgabe erfolgt durch die Datei "mailcart.js". Der Empfänger erhält keine Poskarte, nur eine normale E-Mail.

Veränderungen/Anpassungen der Style-Eigenschaften werden in der CSS-Datei entsprechend vorgenommen.

Hier sind 2 Varianten zur Einbindung erläutert. Sollte dieses Menü auf mehreren Seiten eingesetzt werden, empfiehlt sich die Variante per <?php include "...."; ?> , um Textänderungen des Menüs nur in einer Datei durchführen zu müssen. Hier muss aber die ausführende Datei die Dateiendung .php aufweisen, um den Code ausführen zu können.

ZIP-Datei in ein beliebiges Verzeichnis auf dem PC entpacken und das Verzeichnis "wsX5Obj" auf den Webserver in das Root-Verzeichnis kopieren. HEAD-Code in den HEAD-Bereich <head>.....</head> und HTML-Code in den BODY-Bereich <body>.....</body> der aufrufende Datei einfügen.

Eine demo.php ist beigefügt, die zum Test in das Root-Verzeichnis des Webservers kopiert werden kann.

Aufruf: "http://www.domain.tld/demo.php"

x runter geladen!

Zum Drehen der Postkarte das Motiv, oder die Briefmarke anklicken!

Code für den <HEAD> Bereich

Vor dem </HEAD> Tag

Code für den <BODY> Bereich

<?php include "wsX5Obj/Obj57_0/mailcart.php"; ?>

alternative Einbindung:

<font size="-2">Zum Drehen der Postkarte das Motiv, oder die Briefmarke anklicken!</font>

<?php

if ($_POST) {

# Hier die Daten anpassen
$an_mail="kontakt@home-wiekau.de"; // Eigene E-Mail-Adresse
$an_name="Admin"; // Eigene Anrede (meist: Admin)
$url_name="kontakt-postkarte.php"; // Script-Seite, wo das Script eingebunden ist
$url_ende="kontakt_ok.php"; // Umleitung-Seite, nachdem gesendet wurde
# Diese Nachricht wird an die eigene E-Mail-Adresse gesendet (keine Zeilenumbrüche!)
$text = "Hallo ".$an_name.",\nDu hast eine neue Postkarten-Nachricht von ".$_POST['vorname']." ".$_POST['nachname']." erhalten:\n\n=====\n".$_POST['nachricht']."\n=====\n\nDu kannst den Besucher unter dieser E-Mail ".$_POST['email']." erreichen.";
# E-Mail versenden
@mail($an_mail, $_POST['betreff'], $text, "From: " . $_POST['email']);
# Meldung anzeigen
echo "<table cellPadding='0' cellSpacing='0'>

<tr>

<td id='Obj57_layer'>

<div id='Obj57_filter'>

Hallo ".$_POST['vorname']." ".$_POST['nachname'].", <br>
die Postkarte wurde <br>
gesendet - Vielen Dank!

</div>

</td>

</tr>

</table> ";
# Seite nach Senden aktualisieren
echo '<meta http-equiv="refresh" content="8; url='.$url_ende.'">';
} else

{

<form name="Formular" action="<?php echo $url_name; ?>#Obj57_Anker"

method="post" onSubmit="return eingaben_ueberpruefen();" style="display: inline;">
<a href="javascript:drehen(1);">
<img src="wsX5Obj/Obj57_0/bild.jpg" id="bild" border="0"
width="500" height="357" alt="Foto" title=" Postkarte umdrehen! " style="display: block;"></a>
<table width="500" class="Obj57_tabelle" style="display: none;" id="form">

<tr>

<td width="240">

<input class="Obj57_eingabe" type="text" name="vorname">
<div class="Obj57_anschrift">Vorname</div>
<input class="Obj57_eingabe" type="text" name="nachname">
<div class="Obj57_anschrift">Nachname</div>
<input class="Obj57_eingabe" type="text" name="email">
<div class="Obj57_anschrift">E-Mail-Adresse</div>
<input class="Obj57_eingabe" type="text" name="betreff">
<div class="Obj57_anschrift">Betreff</div>
<span class="Obj57_message">Deine Nachricht:</span><br>
<textarea class="Obj57_feld" name="nachricht"></textarea>
<input class="Obj57_button" type="submit" value="Postkarte absenden">

</td>
<td width="1%"><div class="Obj57_vertikale"></div></td>
<td valign="top">

<div class="Obj57_porto">
<a href="javascript:drehen(2);">
<img src="wsX5Obj/Obj57_0/porto.jpg" width="80" height="91"
alt="Briefmarke" border="0" title=" Postkarte umdrehen! "></a>
</div>
<div class="Obj57_sendto">

An:<br>
<strong>X5forum</strong><br>
<strong>Home-Wiekau</strong><br>
Musterstr. 1<br><br>
<strong>99999 Musterstadt</strong>
</div>

</td>

</tr>

</table>

</form>

<?php

}

Nach dem <BODY> Tag

Code Datei "cart_style.css"

.Obj57_tabelle { background-image: url(papier.jpg); border: solid 1px #000; padding: 10px; }

.Obj57_vertikale { width: 1px; height: 335px; background-color: #797979; }

.Obj57_anschrift { font-family: Tahoma, Arial; font-size: 10px; color: #5F5F5F; }

.Obj57_message { font-family: Tahoma,Arial; font-size: 10px; color: #5F5F5F; text-decoration: underline blink; }

.Obj57_porto { position: absolute; left: 410px; }

.Obj57_eingabe {

border: 0px;
width: 230px;
border-bottom: solid 1px #000;
background-color: transparent;
font-family: "Comic Sans MS", Verdana, Sans-Serif;
font-size: 12px;
color: #0000A0;
}

.Obj57_feld {

width: 230px;
height: 145px;
overflow: auto;
border: solid 1px #000;
background-color: transparent;
font-family: "Comic Sans MS", Verdana, Sans-Serif;
font-size: 12px;
color: #0000A0;
}

.Obj57_sendto {

font-family: "Comic Sans MS", Verdana, Sans-Serif;
font-size: 16px;
color: #000;
margin-top: 150px;
position: absolute;
left: 300px;
}

.Obj57_button {

font-family: Verdana, Sans-Serif;
color: #000;
text-decoration: underline;
font-weight: bold;
font-size: 12px;
background-color: transparent;
border: 0px;
margin-top: 10px;
margin-left: 35px;
width: 155px;
}

#Obj57_filter {

width: 255px;
height: 100px;
padding-left: 15px;
padding-top: 15px;
font-family: "Comic Sans MS", Verdana, Sans-Serif;
font-size: 17px;
font-weight: bold;
color: #000;
text-align: center;
background-color: #FFF;
margin-left: 100px;
filter: alpha(opacity=50);
opacity: 0.5;
}

#Obj57_layer {

width: 500px;
height: 357px;
background-image: url(bild.jpg);
background-repeat: no-repeat;
padding: 20px;
}

Feedbacks zu ""

Kein Kommentar

Vielen Dank für Dein Feedback.