Pular para o conteúdo

Curso Mago Contact Form 7

Contact Form 7 Template Para Personalizar Corpo do E-mail com HTML e CSS

  • Aula 38
  • 10:41 minutos de vídeo

FalaÊ Incuber beleza? Seja muito bem-vindo a mais uma aula do Curso gratuito Mago Contact Form 7 do Nano Academy.

Aqui é o Paulo Felipe e nessa aula eu vou disponibilizar um Contact Form 7 Template Para Personalizar Corpo do E-mail com HTML e CSS utilizando um código simples realizar o processo.

Customizar o layout do e-mail que o dono do site ou o usuário recebe deixa o site bem mais profissional. Já que no Contact Form 7 não tem formula mágica para customizar, sendo assim vem comigo que eu vou te guiar em como fazer isso sem nenhum tipo de sofrimento.

Professor

Paulo Felipe

Front-end na Nano Incub.
Estudou banco de dados na FATEC de Indaiatuba/SP, é formado pela equipe Nano Incub de desenvolvimento, é neurótico por autoconhecimento, pai, skatista, slackliner e doido por ensinar.

Contact Form 7 Template para corpo do e-mail com HTML e CSS

<div style="width: 560px; margin: 0 auto; background-color: #f45762; padding: 30px 0; text-align: center;">
    <img style="margin: 0 auto; max-width: 150px; height: auto;" src="https://academy.nanoincub.com.br/wp-content/uploads/2018/04/logo-nano-academy.png" />
</div>

<div style="width: 500px; margin: 0 auto; padding: 30px; background-color: #f9f9f9; border: 1px solid #ccc;">
    <h3>Contato via Site - Dados do Candidato</h3>

    <h4>Dados pessoais</h4>
    Nome: [nome]
    E-mail: [email]
    Telefone: [telefone]
    Gênero: [genero]
    Data de Nascimento: [data-nascimento]

    <br />
    <hr>
    <br />
    <h4>Dados de endereço</h4>
    Endereço [endereco]
    Nº [numero-residencia]
    Complemento [complemento]
    <br />
    <hr>
    <br />
    <h4>Info Candidato</h4>
    Área de interesse: [area-interesse]
    Portfolio: [link-portfolio]
    Home Office: [home-office]

    Biografia:
    [bio-candidato]
    <br />
    Aceito os termos: [aceitar-dados]

    [_url]

    <a href="https://academy.nanoincub.com.br" title="Visite nosso site">Nano Academy</a>
</div>