En este nuevo artículo vamos a ver cómo enviar un email desde un formulario web creado con HTML, y posteriormente enviar un email con PHP.
Cualquier página web que se precie de hoy en día dispone de un formulario de contacto, y lo normal es que dichos formularios envíen un correo electrónico a quien lo ha rellenado, a modo de confirmación, y otro correo electrónico a los administradores del sitio.
Crear un formulario con HTML y después enviar un email con PHP es un proceso muy sencillo, solamente requiere de una estructura HTML y un pequeño script PHP que recoja y envíe los datos.
Este tipo de formularios son los más comunes en una página web, por lo que a la hora de trabajar en diseño web es muy típico realizar este proceso varias veces.
A continuación veremos cuáles son los pasos a seguir.
El primer paso consiste en crear el formulario mediante código HTML. La etiqueta principal para un formulario en HTML es la etiqueta <form>, dentro de la cual estarán todos los componentes del formulario. Dentro de un formulario HTML podemos introducir varios tipos de campos distintos, aquí listamos los más importantes y utilizados:
Existen más tipos de campos que se pueden introducir, pero los mencionados anteriormente son los más utilizados.
Ahora que conocemos los campos más importantes, es el momento de pasar a crear el formulario HTML. En este caso, se ha creado un formulario muy sencillo con los campos nombre, email, mensaje y la casilla de aceptación de cookies. El código HTML del formulario es el siguiente:
<form method='POST'>
<div class="form-group">
<label for="nombre">Nombre</label>
<input type="text" class="form-control" name='nombre' id="nombre" placeholder="nombre...">
</div>
<div class="form-group">
<label for="email">Email</label>
<input type="email" class="form-control" name='email' id="email" placeholder="email...">
</div>
<div class="form-group">
<label for="exampleTextarea">Mensaje</label>
<textarea class="form-control" name='mensaje' id="mensaje" rows="3"></textarea>
</div>
<div class="form-group">
<input type="checkbox" required> Acepto la política de privacidad.
</div>
<button class="btn btn-primary" type="submit">Enviar</button>
</form>
El anterior código HTML utiliza la maquetación de bootstrap, dando como resultado el siguiente formulario:
Una vez tenemos el formulario HTML listo, es el momento de crear un script PHP que se encargará de recoger los datos introducidos en el formulario y enviar la información correspondiente por email.
Para ello, debemos añadir los parámetros method y action al elemento form. En el parámetro method podemos indicar dos valores; GET o POST. Es recomendable usar el método POST, ya que los datos se envían de forma segura. En el parámetro action indicaremos la ruta del script PHP que gestionará los datos y el envío. El elemento form quedaría algo semejante a esto:
<form method='POST' action='/php/enviar.php'>
Finalmente, procedemos a crear el script PHP en el cual utilizaremos la función mail(). Es una función propia de PHP, si no funciona, es posible que el servidor la tenga deshabilitada y que tengas que habilitarla, o solicitar que la habiliten.
A continuación te mostramos un código PHP muy sencillo y simple que recogerá los datos introducidos en el formulario, y enviará un email a la dirección que especifiques.
<?php
$nombre = $_POST['nombre'];
$email = $_POST['email'];
$asunto = 'Formulario Rellenado';
$mensaje = "Nombre: ".$nombre."<br> Email: $email<br> Mensaje:".$_POST['mensaje'];
if(mail('tuEmail', $asunto, $mensaje)){
echo "Correo enviado";
}
?>
Debes sustituir donde pone tuEmail por la dirección de correo electrónico a la que quieres que se mande el email.
Si quieres aprender más sobre programación segura en PHP, te recomiendo que visites mi artículo sobre la temática. Espero que este artículo te haya resultado útil, si tienes cualquier duda no dudes en dejar un comentario. ¡Muchas gracias!
En esta segunda parte de crear tu primera app, veremos como funcionan la navegación, widgets,… Leer más
La accesibilidad web es clave para llegar a todos los usuarios, independientemente de sus capacidades.… Leer más
En este artículo aprenderás a cómo quitar el fondo de una imagen en Adobe Illustrator… Leer más
El SEO local es una de las estrategias más efectivas para que los negocios atraigan… Leer más
Si no lo has implementado ya en tu estrategia de marketing online, llegas tarde. Pero… Leer más
Descubre cómo usar redirecciones en .htaccess para mejorar tu SEO, evitar errores y optimizar fácilmente… Leer más
Ver comentarios
no me sirvio
¿Qué problemas te dio?
hola me pasa que cuando hago el deploy con firebase, al enviar formulario me descarga el archivo php que puede ser que este haciendo mal? gracias
No he manejado Firebase, no sabría decirte ¿Puede ser que no esté configurado para interpretar el PHP y por eso lo descargue?
¡¡¡ GRACIAS, GRACIAS, GRACIAS !!!
Justo lo que estaba buscando. Sin rodeos, BIEN explicado.
No veo en el HTML donde se incluye este script
Lo puedes aclarar
Gracias
La primera parte, la llamada, se incluye en la etiqueta form:
form method='POST' action='/php/enviar.php'
El resto del código iría en la ruta que le hemos indicado antes, en el archivo 'enviar.php' de la carpeta en raíz 'php'
PORFA COMO DIRECCIONO A QUE CORREO VA ESA INFO..GRACIAS
no me sirvio sale error cuando le doy enviar al formulario
Revisa si la ruta es correcta y los archivos se encuentran donde se indica en el código.
me salio esta pagina no funciona que debe hacer
Hola, sabes como puedo hacer para que cuando se envíe el formulario aparezca un modal con un mensaje diciendo "Correo Enviado", pero sin que se recargue la página?
Con este método no sería posible, ya que al enviar el formulario se carga la página 'php/enviar.php' (ya hemos salido de la página). Tendríamos que añadir un 'header("location: pagina-del-formulario.php");'. A esta URL le podríamos pasar un parámetro y que se dispare el modal si recoge el valor adecuado.
Donde se pondria el codigo php? hay que armar un nuevo directorio? o entre que etiquetas del html se pondrian?
El código PHP lo pondríamos en la ruta que le hemos indicado, en el archivo 'enviar.php' de la carpeta 'php'.
No me funcionó, pero tengo algunas dudas:
1.- La carpeta php? tengo WampServer: www/micarpeta
2.- ¿Cómo configuro el servidor de localhost para SMTP?
Saludos
copie tal cual el codigo y modifique para que llegue a mi mail pero al presionar el boton de enviar, me redirije a /php/enviar.php y dice que la pagina no funciona. ademas del codigo de php que describiste hay que meter algo mas en ese archivo o que estoy haciendo mal ?