BootstrapHTMLPHP

Criando um Formulário de E-mail Bootstrap + PHP

Dale galera, muitos iniciantes em programação sente dificuldade em criar um simples formulário de contato para seus sites.

Hoje vou dar uma palhinha de como é simples e fácil utilizar o bootstrap e o php para envio do mesmo.

Prontos?

Vou criar uma pagina chamada contato.php

Exemplo Aqui

Nesse exemplo vou usar cdn bootstrap

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
<!-- Bootstrap -->

<style type="text/css">
  input,textarea, button{<br />    margin: 10px 0 0px 0;<br />  }<br /></style>
<div class="container" style="margin-top: 50px;">
<h2>Bootstrap 4.0</h2>
<div class="row">
<div class="col-sm-6">

<!-- Aqui abro a tag form e defino a action e o metodo a ser enviado Action = Página destino Method = Post (envia o código de maneira "não visível na url" -->

<form action="enviaContato.php" method="post"><!-- input do formulario -->
<div class="row">
<div class="col-sm-12"><input id="empresa" class="form-control" name="empresa" required="" type="text" placeholder="Empresa" /></div>
</div>
<div class="row">
<div class="col-sm-12"><input id="nome" class="form-control" name="nome" required="" type="text" placeholder="Nome" /></div>
</div>
<div class="row">
<div class="col-sm-6"><input id="telefone" class="form-control" name="telefone" required="" type="text" placeholder="Telefone" /></div>
<div class="col-sm-6"><input id="email" class="form-control" name="email" required="" type="email" placeholder="email" /></div>
</div>
<div class="row">
<div class="col-sm-12"><textarea id="mensagem" class="form-control" name="mensagem" required="" placeholder="mensagem">    </textarea></div>
</div>
<div class="row">
<div class="col-sm-12"><button class="btn btn-dark" type="submit">Enviar</button></div>
</div>
</form></div>
<div class="col-sm-6">
<h5>Telefone</h5>
11 99999-9999

<hr />

<h5>E-mail</h5>
mariones@mariones.com.br

<hr />

<button class="btn btn-dark">Ver Mapa</button>

</div>
</div>
</div>
<div style="position: absolute; bottom: 0;">by @bross - agencia2m</div>
<!-- Bootstrap -->
<script src="https://code.jquery.com/jquery-3.3.1.slim.min.js" integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.3/umd/popper.min.js" integrity="sha384-ZMP7rVo3mIykV+2+9J3UJ46jBk0WLaUAdn689aCwoqbBJiSnjAK/l8WvCWPIPm49" crossorigin="anonymous"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/js/bootstrap.min.js" integrity="sha384-ChfqqxuZUCnJSK3+MXmPNIyE6ZbWh2IMqE241rYiqJxyMiZ6OW/JmZQ5stwEULTy" crossorigin="anonymous"></script>

Formulário básico criado em html + bootstrap.

Agora vamos tratar o envio com mail()

O que fiz nesse momento foi tratar os dados do formulário enviado via post e com isso joguei em variaveis
onde as juntei na variavel $texto e com isso criei os headers onde possibilita o envio em html para o destinátario

nesse Caso eu criei dois headers assim enviei outro e-mail com rodape para o próprio cliente que enviou

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
<!--?php &lt;br ?--> /* Envio de E-mail mail()
Arquivo enviaContato.php - PHP
criado: 16/08/2018
Criado por: @Bross
www.tosempreai.com.br
brosslightyear@gmail.com
***********************************************************
*/


// Aqui simplesmente estou pegando os input do formulário via post

$empresa = $_POST["empresa"];
$nome = $_POST["nome"];
$telefone = $_POST["telefone"];
$email = $_POST["email"];
$mensagem = $_POST["mensagem"];

$texto = "
<h3>Formulário</h3>
<b>Empresa:</b> $empresa
<b>Nome do Cliente:</b> $nome
<b>Telefone:</b> $telefone
<b>E-mail:</b> $email
<b>Mensagem:</b> $mensagem
"
;

//AQUI ENVIO O PRIMEIRO EMAIL PARA O DESTINATARIO
$emailDestino = "brosslightyear@gmail.com";
$headers = "MIME-Version: 1.0\r\n";
$headers .= "Content-type: text/html; charset=iso-8859-1\r\n";
$headers .= "From:" . $email . "\r\n";
mail($emailDestino, 'Teste de E-mail', $texto, $headers);

//AQUI ENVIO O PRIMEIRO EMAIL PARA O CLIENTE

$headers2 = "MIME-Version: 1.0\r\n";
$headers2 .= "Content-type: text/html; charset=iso-8859-1\r\n";
$headers2 .= "From:" . $email . " \r\n";
$texto .= "Seu e-mail foi recebido por um de nossos atendentes
Em breve será respondido!

Departamento Comercial ...
www.tosempreai.com.br
brosslightyear@gmail.com
Obrigado

<img src="
http://tosempreai.com.br/wp-content/uploads/2017/06/tosempreai.png" />";
mail($email, 'Teste de E-mail', $texto, $headers2);

//REDIRECIONO PARA PAGINA CONTATO.PHP
print '<script>location.href= "contato.php";</script>';

?&gt;

Download Código

https://github.com/mariovpirani/contact-form-bootstrap

Download Aqui

Simplão e funcional

Abraços
Para aulas de php e Bootstrap fale comigo

@bross

2 thoughts on “Criando um Formulário de E-mail Bootstrap + PHP

Deixe um comentário