Mail Form con PHP, Css e HTML

Esistono diversi modi per creare un mail form con HTML, CSS e PHP: quello che vedremo oggi è uno dei sistemi più semplici che ho personalmente utilizzato in diversi siti con molteplici varianti (con menù a tendina, attributo placeholder, più campi da compilare, campi obbligatori etc.). Creiamo un file PHP e chiamiamolo Index; prepariamo uno stile CSS direttamente nell’<head>.

<style type="text/css">

.form{width:350px;text-align:center;margin:0px auto;}
.nome{float:left;background-color:#e8e5dd;width:80px;}
.cognome{float:left;background-color:#e8e5dd;width:80px;}
.citta{float:left;background-color:#e8e5dd;width:80px;}
.email{float:left;background-color:#e8e5dd;width:80px;}
.oggetto{float:left;background-color:#e8e5dd;width:80px;}
.testo{width:80px;float:left;background-color:#e8e5dd;}
.destinatario{float:left;width:80px;background-color:#e8e5dd;}
.formset{color:#000;text-align:left;width:230px;font-family:Arial, Helvetica, sans-serif; font-size:13px;border:solid 1px #999;border-style:inset;border-width:1px;background-color:#e8e5dd;border-spacing:2px;}
.textareaset{color:#000;text-align:left;width:230px;font-family:Arial, Helvetica, sans-serif; font-size:13px;border:solid 1px #999;border-style:inset;border-width:1px;background-color:#e8e5dd;}
.input{margin-top:13px;float:left;margin-left:97px;}

</style>

Abbiamo impostato dimensioni, colore di fondo, bordi dei campi e colore del testo nelle colonne destra e sinistra. Passiamo ora all’HTML, all’interno del <body>:

<div class="form">
<div><form action="<?php $_SERVER['PHP_SELF'] ?>
" method="post" name="form1">

<span class="nome">nome</span><input class="formset" type="text" name="nome" />

<span class="cognome">cognome</span><input class="formset" type="text" name="cognome" />

<span class="citta">città</span><input class="formset" type="text" name="citta" />

<span class="email">mail</span><input class="formset" type="text" name="mail" />

<span class="oggetto">oggetto</span><input class="formset" type="text" name="oggetto" />

<span class="testo">testo</span><textarea class="textareaset" name="testo" rows="10" cols="40"></textarea>

<input class="input" type="submit" name="invia" value="Invia" /></form></div>
</div>

Non resta che inserire il semplice codice PHP:

<!--?php <br ?-->
if (isset($_POST['invia']) ){
$to = "[email protected]";
$subject = "Messaggio";
$body = "Contenuto del modulo:\n\n";
$body .= "Nome: " . trim(stripslashes($_POST["nome"])) . "\n";
$body .= "Cognome: " . trim(stripslashes($_POST["cognome"])) . "\n";
$body .= "Città: " . trim(stripslashes($_POST["citta"])) . "\n";
$body .= "Oggetto: " . trim(stripslashes($_POST["oggetto"])) . "\n";
$body .= "Testo: " . trim(stripslashes($_POST["testo"])) . "\n";
$body .= "Mail: " . trim(stripslashes($_POST["mail"])) . "\n";
$headers = "From: Tuo sito";
if(@mail($to, $subject, $body, $headers)) {
echo "</pre>
<div>La mail è stata inoltrata con successo</div>
<pre>
";//La mail è stata inoltrata con successo
} else {
echo "</pre>
<div>Si sono verificati dei problemi</div>
<pre>
";//Si sono verificati dei problemi con l'inoltro della mail
}
}

?>

In $to sostituiamo “[email protected]” con l’indirizzo mail dove vogliamo ricevere il messaggio.

Aggiungiamo tanti $body quanti sono i campi che ci interessa avere nel form. In $headers sostituiamo “Tuo sito” col nome del nostro sito.

Infine all’interno del comando echo specifichiamo con HTML se l’invio della mail ha avuto successo oppure no.

Naturalmente avremo bisogno di un server che supporti PHP per testare il funzionamento del form.

Ed eccoci al download. Alla prossima!