Como criar formulário de contato e enviar e-mail com a mensagem
Neste tutorial, será apresentado como criar um formulário de contato e enviar e-mail com a mensagem.
Primeiramente, será demonstrado como criar o formulário com HTML.
Em seguida, será explicado como receber e validar os dados do formulário com PHP.
Por fim, será mostrado como enviar os dados do formulário para o e-mail da empresa e do cliente.
Enviar e-mail gratuito via SMTP: Acessar
Download do código fonte desenvolvido na aula: Download
Curso de PHP Developer: Mais Detalhes do Curso
Receber as aulas gratuitas do curso de PHP Developer: Acessar
Para começar, é criado o arquivo "index.php" com o formulário, também incluir o arquivo "styles.css" com css e o arquivo "enviar_mensagem_email.php".
<!DOCTYPE html>
<html lang="pt-br">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Celke</title>
<link rel="stylesheet" href="styles.css">
</head>
<body>
<div class="container-formulario">
<h2>Fale Conosco</h2>
<?php
include_once 'enviar_mensagem_email.php';
?>
<form action="" method="POST">
<div class="grupo-formulario">
<label for="nome">Nome: </label>
<input type="text" name="nome" id="nome" placeholder="Nome completo" value="<?php echo $dados['nome'] ?? '' ?>">
</div>
<div class="grupo-formulario">
<label for="email">E-mail: </label>
<input type="email" name="email" id="email" placeholder="Seu melhor e-mail" value="<?php echo $dados['email'] ?? '' ?>">
</div>
<div class="grupo-formulario">
<label for="assunto">Assunto: </label>
<input type="text" name="assunto" id="assunto" placeholder="Assunto da mensagem" value="<?php echo $dados['assunto'] ?? '' ?>">
</div>
<div class="grupo-formulario">
<label for="conteudo">Conteúdo: </label>
<textarea name="conteudo" id="conteudo" placeholder="Digite sua mensagem" rows="5"><?php echo $dados['conteudo'] ?? '' ?></textarea>
</div>
<button type="submit" name="btnEnviarMensagem" id="btnEnviarMensagem" value="btnEnviarMensagem">Enviar</button>
</form>
</div>
</body>
</html>
Criado o arquivo "style.css" com o CSS para personalizar o formulário.
* {
margin: 0;
padding: 0;
box-sizing: border-box;
}
body {
font-family: Arial, sans-serif;
background-color: #f4f4f4;
display: flex;
justify-content: center;
align-items: center;
height: 100vh;
}
.container-formulario {
background-color: #fff;
padding: 20px;
border-radius: 8px;
box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
width: 100%;
max-width: 500px;
}
h2 {
text-align: center;
margin-bottom: 20px;
color: #333;
}
.grupo-formulario {
margin-bottom: 15px;
}
.grupo-formulario label {
display: block;
font-weight: bold;
margin-bottom: 5px;
}
.grupo-formulario input,
.grupo-formulario textarea {
width: 100%;
padding: 10px;
border: 1px solid #ccc;
border-radius: 4px;
font-size: 16px;
}
.grupo-formulario input:focus,
.grupo-formulario textarea:focus {
border-color: #007bff;
outline: none;
}
button {
width: 100%;
padding: 10px;
background-color: #007bff;
border: none;
color: #fff;
font-size: 16px;
border-radius: 4px;
cursor: pointer;
}
button:hover {
background-color: #0056b3;
}
.alert-success {
background-color: #d1e7dd;
color: #47a447;
margin: 10px 0;
border-radius: 4px;
padding: 12px 7px;
}
.alert-danger {
background-color: #f8d7da;
color: #d2322d;
margin: 10px 0;
border-radius: 4px;
padding: 12px 7px;
}
Criado o arquivo "enviar_mensagem_email.php", o mesmo recebe os dados doo formulário, faz a validação dos dados e envia o e-mail para a empresa e para o cliente com a mensagem do formulário.
<?php
// Receber os dados do formulário
$dados = filter_input_array(INPUT_POST, FILTER_DEFAULT);
// var_dump($dados);
// Validar o campo nome
if (isset($dados['nome']) and empty($dados['nome'])) {
echo "<div class='alert-danger'>Necessário preencher o campo nome!</div>";
} elseif (isset($dados['email']) and empty($dados['email'])) { // Validar o campo email
echo "<div class='alert-danger'>Necessário preencher o campo e-mail!</div>";
} elseif (isset($dados['assunto']) and empty($dados['assunto'])) { // Validar o campo assunto
echo "<div class='alert-danger'>Necessário preencher o campo assunto!</div>";
} elseif (isset($dados['conteudo']) and empty($dados['conteudo'])) { // Validar o campo conteudo
echo "<div class='alert-danger'>Necessário preencher o campo conteúdo!</div>";
} elseif (!empty($dados['btnEnviarMensagem'])) {
// Dados do usuário - Iagente: https://login.iagente.com.br/solicitacao-conta-smtp/origin/celke
// Recomendado salvar em variáveis de ambiente: https://celke.com.br/artigo/como-usar-variaveis-de-ambiente-env-no-php
$apiUsuario = 'usuario_da_api_na_IAGENTE';
$apiChave = 'chave_na_api_na_IAGENTE';
// Dados do e-mail que deve ser enviado para a empresa
$dados = [
"api_user" => $apiUsuario,
"api_key" => $apiChave,
"to" => [
[
// Destinatário o cliente
"email" => $dados['email'],
"name" => $dados['nome'],
"custom" =>
[
"subject" => "Recebida a mensagem de contato",
"conteudoHtml" => "Prezado(a) {$dados['nome']}<br><br>
Seu email foi recebido.<br>
Será lido o mais rápido possÃvel.<br>
Em breve será respondido.<br><br>
Assunto: {$dados['assunto']}<br>
Mensagem: {$dados['conteudo']}",
"conteudoTexto" => "Prezado(a) {$dados['nome']}\n\n
Seu email foi recebido.\n
Será lido o mais rápido possÃvel.\n
Em breve será respondido.\n\n
Assunto: {$dados['assunto']}\n
Mensagem: {$dados['conteudo']}"
]
],
[
// Destinatário da empresa
"email" => "email_destinatario_empresa@gmail.com",
"name" => "nome_destinatario_empresa",
"custom" =>
[
"subject" => $dados['assunto'],
"conteudoHtml" => "Usuário: {$dados['nome']}<br>
E-mail: {$dados['email']}<br><br>
Assunto: {$dados['assunto']}<br>
Mensagem: {$dados['conteudo']}<br>",
"conteudoTexto" => "Usuário: {$dados['nome']}\n
E-mail: {$dados['email']}\n\n
Assunto: {$dados['assunto']}\n
Mensagem: {$dados['conteudo']}\n"
]
]
],
"from" =>
[
// E-mail utilizado para enviar e Remetente
"name" => "nome_do_rementente_no_email",
"email" => "email_utilizado_para_enviar_email_cadastrado_na_IAGENTE@gmail.com",
"reply_to" => "email_remetente_cadastrado_na_IAGENTE@gmail.com",
],
"subject" => "{{subject}}",
"html" => "{{conteudoHtml}}",
"text" => "{{conteudoTexto}}",
"campanhaid" => "2",
"addheaders" =>
[
"x-priority" => "1"
]
];
// Chamar a função enviar e-mail
enviarEmail($dados);
}
// Função enviar e-mail
function enviarEmail($dados)
{
// URL da API
$url = "api.iagentesmtp.com.br/api/v3/send/";
// A função curl_init() inicializa uma nova sessão
$ch = curl_init($url);
// Configurar a requisição POST
curl_setopt($ch, CURLOPT_POST, 1);
curl_setopt($ch, CURLOPT_POSTFIELDS, json_encode($dados));
// Definir os cabeçalhos da requisição
curl_setopt($ch, CURLOPT_HTTPHEADER, [('Content-Type: application/json')]);
// Configurar para receber a resposta da requisição como uma string
curl_setopt($ch, CURLOPT_RETURNTRANSFER, true);
// Executar a requisição
$resposta = curl_exec($ch);
// Fechar a sessão cURL
curl_close($ch);
// Verificar se ocorreu algum erro
if (curl_errno($ch)) {
// Recomendado salvar no log, como salvar log com PHP: https://celke.com.br/artigo/como-criar-arquivo-de-log-no-php
// echo "<div class='alert-danger'>Erro: cURL: " . curl_errno($ch) . "!</div>";
echo "<div class='alert-danger'>Erro: Mensagem não enviada!</div>";
} else {
// Decodificar a resposta JSON
$dadosResposta = json_decode($resposta, true);
// Verificar o campo "status" na resposta para determinar o resultado
if ($dadosResposta && isset($dadosResposta['status'])) {
// Enviado e-mail com sucesso
if ($dadosResposta['status'] === 'ok') {
echo "<div class='alert-success'>Mensagem enviada com sucesso!</div>";
// Recomendado salvar no banco de dados: https://celke.com.br/artigo/crud-como-criar-o-formulario-cadastrar-com-php-e-pdo
} else {
// Erro mensagem não enviada
// echo "<div class='alert-danger'>Erro: Não obteve resposta da Iagente!</div>";
echo "<div class='alert-danger'>Erro: Mensagem não enviada!</div>";
}
} else {
// Erro a Iagente não enviou a resposta com status
// echo "<div class='alert-danger'>Erro: Não obteve resposta da Iagente!</div>";
echo "<div class='alert-danger'>Erro: Mensagem não enviada!</div>";
}
}
}
Baixar o código-fonte completo do projeto.
Bom, era isso. Espero que o tutorial tenha sido útil!