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
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 <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>'; ?> |
Download Código
https://github.com/mariovpirani/contact-form-bootstrap
Simplão e funcional
Abraços
Para aulas de php e Bootstrap fale comigo
@bross
Hello. And Bye.
hi 🙂 bross 🙂