Cuando en nuestra página web queremos poner un link para enviar un email a un destinatario, lo hacemos de la forma siguiente:
Añadir el mailto
Para que funcione el enlace tenemos que reemplazar email@dominio.com por el email del destinatario. Lo podemos hacer de la forma siguiente:
<a href=»mailto:email@dominio.com»>Enviar Email</a>
Añadir asunto al Email
Para añadir un asunto al email, usamos la siguiente sintaxis:
<a href=»mailto:email@dominio.com?subject=Asunto»>Enviar Email</a>
Añadir cuerpo al Email
Si queremos que aparezca un texto en el cuerpo del email, lo añadimos de la forma siguiente:
<a href=»mailto:email@dominio.com?body=Texto»>Enviar Email</a>
Añadir asunto y cuerpo al Email
Para añadir tanto el asunto como el cuerpo del email, usamos la siguiente sintaxis:
<a href=»mailto:email@dominio.com?subject=Asunto&body=Texto»>Enviar Email</a>
Para conseguir que hagan más clic en el enlace para enviar el email, podemos utilizar una imagen en lugar de un texto. De esta forma, además de añadir un atributo alt para el posicionamiento en buscadores, conseguiremos que el enlace se vea más atractivo para el usuario.
Recomendaciones
Por seguridad, es recomendable no mostrar el email del destinatario en el código. Para ello, podemos usar un formulario de contacto enviando el email mediante un script PHP.
¿Formulario o mailto?
En general, se recomienda usar un formulario de contacto enviando el email mediante un script PHP. No obstante, en algunos casos podemos usar el mailto, como por ejemplo si queremos permitir que los usuarios manden un email con un archivo adjunto desde nuestra página web.
En wordpress
Podemos encontrar plugins de contact form que simplifican la creación de formularios de contacto.
Plugins:
- Contact Form 7
- Gravity Forms
- Formidable Forms
Támbien, podemos considerar la posibilidad de contratar un servicio de formularios de contacto, como por ejemplo 123FormBuilder.
Personalizar el botón mailto con CSS
Podemos personalizar el botón mailto con CSS. Con la siguiente clase, podemos modificar el color, el tamaño, la fuente, etc.
.mailto {
color: #fff;
background-color: #3498db;
padding: 10px 20px 10px 20px;
font-size: 16px;
border: none;
cursor: pointer;
}
.mailto:hover {
background: #2980b9;
color: #fff;
}
Cómo enviar mediante SMTP
Para enviar los emails mediante SMTP, debemos configurar nuestro servidor web o nuestro script PHP.
Configurar el servidor web
Por ejemplo, en Apache con el módulo mod_auth_smtp, podemos establecer los parámetros de configuración para el envío de emails en el archivo .htaccess de la siguiente forma:
AuthName «Nombre del servidor SMTP»
AuthType Basic
AuthUserName nombre@dominio.com
AuthPassword password
require valid-user
ErrorDocument 401 default
SuexecUserGroup nombre nombre
smtpHost smtp.dominio.com
smtpPort 587
smtpFrom nombre@dominio.com
smtpAuth on
smtpSecure TLS
Configurar mediante script PHP
En PHP, podemos configurar el envío de emails de la siguiente forma:
<?php
// Debes editar las próximas dos líneas de código de acuerdo con tus preferencias
$email_to = «email@dominio.com»;
$email_subject = «Asunto del email»;
// Aquí se deberían validar los datos ingresados por el usuario
if(!isset($_POST[‘first_name’]) ||
!isset($_POST[‘last_name’]) ||
!isset($_POST[‘email’]) ||
!isset($_POST[‘telephone’]) ||
!isset($_POST[‘comments’])) {
echo «<b>Ocurrió un error y el formulario no ha sido enviado. </b><br />»;
echo «Por favor, vuelva atrás y verifique la información ingresada<br />»;
die();
}
$email_message = «Detalles del formulario de contacto:\n\n»;
$email_message .= «Nombre: » . $_POST[‘first_name’] . «\n»;
$email_message .= «Apellido: » . $_POST[‘last_name’] . «\n»;
$email_message .= «E-mail: » . $_POST[‘email’] . «\n»;
$email_message .= «Teléfono: » . $_POST[‘telephone’] . «\n»;
$email_message .= «Comentarios: » . $_POST[‘comments’] . «\n\n»;
// Ahora se envía el e-mail usando la función mail() de PHP
$headers = ‘From: ‘.$email_from.»\r\n».
‘Reply-To: ‘.$email_from.»\r\n» .
‘X-Mailer: PHP/’ . phpversion();
@mail($email_to, $email_subject, $email_message, $headers);
echo «¡El formulario se ha enviado con éxito!»;
?>
Contratar un Freelance
Si no dispones de tiempo o no te sientes capacitado para realizar la configuración, puedes contratar un freelance.
