En esta parte veremos como almacenar los valores ingresados por el usuario en nuestro formulario y almacenarlos en una base de datos MySQL usando PHP para ello, vamos a utilizar el mismo codigo del tutorial anterior.

1. Antes de empezar

Ya que vamos a trabajar con PHP, es necesario que tengas instalado en tu sistema un servidor local que soporte PHP.

Lo primero que vamos a hacer es crear una tabla con los campos del formulario, si haz modificado el formulario añadiendole o quitandole campos, tendras que hacer lo mismo aqui, el siguiente codigo es un SQL que podemos ejecutar desde phpMyAdmin o ingresarlo manualmente si no disponimos de esa herramienta:

CREATE TABLE `cf` (
  `id` int(11) NOT NULL AUTO_INCREMENT,
  `nombre` varchar(255) NOT NULL,
  `email` varchar(255) NOT NULL,
  `asunto` varchar(255) NOT NULL,
  `mensaje` text NOT NULL,
  PRIMARY KEY (`id`)
) ENGINE=InnoDB DEFAULT CHARSET=latin1 AUTO_INCREMENT=1 ;

Le vamos a poner ‘cf’ (contact form) a la tabla y definimos los campos, primero id que va a ser la llave primaria y con auto_increment y luego los campos del formulaio.

Ahora vamos a crear un nuevo archivo donde se van almacenar los datos de conexión a la base de datos, a este le pondremos conexion.php:

El contenido de este archivo tiene que ser asi:

<?php

$host = 'localhost';
$usuario = 'root';
$pass = 'root';

$conn = mysql_connect($host, $usuario, $pass) or die ('Error conectando a la base de datos');

$bdnombre = 'cf';
mysql_select_db($bdnombre);

Allí definiremos las credenciales de conexión a MySQL, en caso de trabajar en un servidor local casi siempre son esos (localhost, root, root).

2. index.php

Abrimos este archivo y modificamos la parte de PHP, lo primero sera incluir a conexion.php, en esta ocasion vamos a usar require, ya que es necesario que ese archivo este presente:

<?php
        require("conexion.php");

        if(isset($_POST['boton'])){
            if($_POST['nombre'] == ''){
                $error1 = '<span class="error">Ingrese su nombre</span>';
            }else if($_POST['email'] == '' or !preg_match("/^[a-zA-Z0-9_\.\-]+@[a-zA-Z0-9\-]+\.[a-zA-Z0-9\-\.]+$/",$_POST['email'])){
                $error2 = '<span class="error">Ingrese un email correcto</span>';
            }else if($_POST['asunto'] == ''){
                $error3 = '<span class="error">Ingrese un asunto</span>';
            }else if($_POST['mensaje'] == ''){
                $error4 = '<span class="error">Ingrese un mensaje</span>';
            }else{
                $dest = "tu@email.com"; //Email de destino
                $nombre = $_POST['nombre'];
                $email = $_POST['email'];
                $asunto = $_POST['asunto']; //Asunto
                $cuerpo = $_POST['mensaje']; //Cuerpo del mensaje
                //Cabeceras del correo
                $headers = "From: $nombre <$email>\r\n"; //Quien envia?
                $headers .= "X-Mailer: PHP5\n";
                $headers .= 'MIME-Version: 1.0' . "\n";
                $headers .= 'Content-type: text/html; charset=iso-8859-1' . "\r\n"; //

                if(mail($dest,$asunto,$cuerpo,$headers)){
                    $result = '<div class="result_ok">Email enviado correctamente <img src="https://web.tursos.com/wp-includes/images/smilies/icon_smile.gif" alt=":)" class="wp-smiley"> </div>';
                    // si el envio fue exitoso reseteamos lo que el usuario escribio:
                    $_POST['nombre'] = '';
                    $_POST['email'] = '';
                    $_POST['asunto'] = '';
                    $_POST['mensaje'] = '';

                }else{
                    $result = '<div class="result_fail">Hubo un error al enviar el mensaje <img src="https://web.tursos.com/wp-includes/images/smilies/icon_sad.gif" alt=":(" class="wp-smiley"> </div>';

                }
            }
        }
    ?>

Ahora nos movemos hasta la linea 34 luego de la parte donde se hace la condicional si envio o no el correo, alli añadimos un salto de linea y ponemos dos lineas en una se va a guardar la consulta SQL que se va ejecutar y la otra va a ir la funcion que la ejecute:

if(mail($dest,$asunto,$cuerpo,$headers)){

$sql = "INSERT INTO `cf` (`nombre`,`email`,`asunto`,`mensaje`) VALUES ('{$_POST['nombre']}','{$_POST['email']}','{$_POST['asunto']}','{$_POST['mensaje']}')"; 
mysql_query($sql) or die(mysql_error()); 

$result = '<div class="result_ok">Email enviado correctamente :)</div>';    
// si el envio fue exitoso reseteamos lo que el usuario escribio:
$_POST['nombre'] = '';
$_POST['email'] = '';
$_POST['asunto'] = '';
$_POST['mensaje'] = '';

}else{
    $result = '<div class="result_fail">Hubo un error al enviar el mensaje :(</div>';   
}

Y con eso ya tendríamos nuestro formulario funcionando, recuerda que si modificaste los campos haz de hacerlo tambien en la consulta, por ejemplo:

$sql = "INSERT INTO `cf` (`nombre`,`email`,`asunto`,`mensaje`,`campo_z`,`campo_x`,`campo_y`) 
VALUES ('{$_POST['nombre']}','{$_POST['email']}','{$_POST['asunto']}','{$_POST['mensaje']}','{$_POST['campo_z']}','{$_POST['campo_x']}','{$_POST['campo_y']}')";

O en caso tengas el los valores guardados/concatenados en variables:

$sql = "INSERT INTO `cf` (`nombre`,`email`,`asunto`,`mensaje`) 
VALUES ('$nombre','$email','$asunto','$mensaje','$body')";

3. Mejoras de seguridad

Como vamos a trabajar con bases de datos es recomendable asegurarnos que no nos inyecten el formulario, para eso vamos a usar mysql_real_escape_string antes de la consulta mediante un foreach, de esta forma lo hara en todas las variables POST que se hayan ingresado:

if(mail($dest,$asunto,$cuerpo,$headers)){

                    foreach($_POST AS $key => $value) { 
                        $_POST[$key] = mysql_real_escape_string($value); 
                    } 

                    $sql = "INSERT INTO `cf` (`nombre`,`email`,`asunto`,`mensaje`) VALUES ('{$_POST['nombre']}','{$_POST['email']}','{$_POST['asunto']}','{$_POST['mensaje']}')"; 
                    mysql_query($sql) or die(mysql_error()); 

                    $result = '<div class="result_ok">Email enviado correctamente :)</div>';    
                    // si el envio fue exitoso reseteamos lo que el usuario escribio:
                    $_POST['nombre'] = '';
                    $_POST['email'] = '';
                    $_POST['asunto'] = '';
                    $_POST['mensaje'] = '';

                }else{
                    $result = '<div class="result_fail">Hubo un error al enviar el mensaje :(</div>';   
                }

4. Código Final

 <?php
    require('conexion.php'); 

    if(isset($_POST['boton'])){
        if($_POST['nombre'] == ''){
            $error1 = '<span class="error">Ingrese su nombre</span>';
        }else if($_POST['email'] == '' or !preg_match("/^[a-zA-Z0-9_\.\-]+@[a-zA-Z0-9\-]+\.[a-zA-Z0-9\-\.]+$/",$_POST['email'])){
            $error2 = '<span class="error">Ingrese un email correcto</span>';
        }else if($_POST['asunto'] == ''){
            $error3 = '<span class="error">Ingrese un asunto</span>';
        }else if($_POST['mensaje'] == ''){
            $error4 = '<span class="error">Ingrese un mensaje</span>';
        }else{
            $dest = "tu@email.com"; //Email de destino
            $nombre = $_POST['nombre'];
            $email = $_POST['email'];
            $asunto = $_POST['asunto']; //Asunto
            $cuerpo = $_POST['mensaje']; //Cuerpo del mensaje
            //Cabeceras del correo
            $headers = "From: $nombre <$email>\r\n"; //Quien envia?
            $headers .= "X-Mailer: PHP5\n";
            $headers .= 'MIME-Version: 1.0' . "\n";
            $headers .= 'Content-type: text/html; charset=iso-8859-1' . "\r\n"; //

            if(mail($dest,$asunto,$cuerpo,$headers)){

                foreach($_POST AS $key => $value) {
                    $_POST[$key] = mysql_real_escape_string($value);
                } 

                $sql = "INSERT INTO `cf` (`nombre`,`email`,`asunto`,`mensaje`) VALUES ('{$_POST['nombre']}','{$_POST['email']}','{$_POST['asunto']}','{$_POST['mensaje']}')";
                mysql_query($sql) or die(mysql_error()); 

                $result = '<div class="result_ok">Email enviado correctamente <img src="https://web.tursos.com/wp-includes/images/smilies/icon_smile.gif" alt=":)" class="wp-smiley"> </div>';
                // si el envio fue exitoso reseteamos lo que el usuario escribio:
                $_POST['nombre'] = '';
                $_POST['email'] = '';
                $_POST['asunto'] = '';
                $_POST['mensaje'] = '';

            }else{
                $result = '<div class="result_fail">Hubo un error al enviar el mensaje <img src="https://web.tursos.com/wp-includes/images/smilies/icon_sad.gif" alt=":(" class="wp-smiley"> </div>';
            }
        }
    }
?>
<html>
    <head>
        <title>Contacto</title>
        <link rel='stylesheet' href='estilos.css'>
        <script src='http://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js'></script>
        <script src='funciones.js'></script>
    </head>
    <body>
        <form class='contacto' method='POST' action=''>
            <div><label>Tu Nombre:</label><input type='text' class='nombre' name='nombre' value='<?php echo $_POST['nombre']; ?>'><?php echo $error1 ?></div>
            <div><label>Tu Email:</label><input type='text' class='email' name='email' value='<?php echo $_POST['email']; ?>'><?php echo $error2 ?></div>
            <div><label>Asunto:</label><input type='text' class='asunto' name='asunto' value='<?php echo $_POST['asunto']; ?>'><?php echo $error3 ?></div>
            <div><label>Mensaje:</label><textarea rows='6' class='mensaje' name='mensaje'><?php echo $_POST['mensaje']; ?></textarea><?php echo $error4 ?></div>
            <div><input type='submit' value='Envia Mensaje' class='boton' name='boton'></div>
            <?php echo $result; ?>
        </form>
    </body>
</html>

Con eso hemos terminado esta ultima parte del formulario (por ahora), recuerda que puedes descargarte el código fuente en este enlace.

Si no entendiste una parte o tienes alguna duda, házmela saber en los comentarios.