![[ Ferramentas Blog ]](/wordpress/wp-content/themes/fb5/images/logo.png){kind=logo}
Para atender à necessidade de muitos blogueiros, especialmente no Blogger, de adicionar uma página estática com um formulário de contatos eficiente, resolvi criar um modelo objetivo e fácil de usar, totalmente gratuito e que vou ensinar a fazer agora. Todos podem adicionar usando o recurso de página estática padrão do Blogger e sem limite de quantidade de mensagens.
Quem não sabe da novidade de se poder criar páginas estáticas no Blogger, leia:
AVISO: Devido a erros no sistema de recebimento dos emails (o servidor não está suportando tantos usuários, este formulários foi desativado.Sugerimos que use outro modelo, como este do seguinte tutorial:
O modelo que vou ensinar aqui pode ser visto e testado na seguinte página de testes. Veja o funcionamento e como ficará ao adicionar em seu blog:
Agora, vamos por a mão na massa, ou melhor, nos códigos.
Passo 1 – Preparando a página estática.A primeira coisa a fazer é criar uma página estática. Para isso vá ao painel do Blogger, clique no menu “Postagem” ~> “Editar páginas” e clique no botão “NOVA PÁGINA”.
O que vai abrir é um editor de posts exatamente como você já está acostumado a ver, como é o padrão do Blogger. Dê um título para essa página e clique na aba “Editar HTML” do editor, como ilustra a imagem:
Isso é importante, pois a única coisa que você vai precisar fazer é colar o código do formulário aí. Mas ainda não acabou. Veja que na base do editor há um link que diz “Opções de postagem”. Clique aí pra definir a quebra de linhas na aba que abrir:
Marque as mesmas opções mostradas, principalmente a que diz “Ignorar linhas novas”. Feito isso você já pode passar para o próximo passo e adicionar o código HTML do formulário de contatos.
Passo 2 – Adicionando o código HTMLNa área de texto do editor, cole o seguinte código HTML e só mude o que indicarmos logo abaixo.
<script language="javascript">
function verifica(){
if ((document.FormContato.nome.value == "") || (document.FormContato.email.value == "") || (document.FormContato.mensagem.value == "")){
alert("Preencha os campos marcados com '*'");
return false;
}
else
return true;
}
</script> <form action="https://ferramentasblog.com.br/templates/formmail.php" method="post" name="FormContato" onsubmit="return verifica();">
<input type="hidden" name="receber" value="SEU_EMAIL@SERVICO.COM" />
<p style="border-bottom: 1px dotted #3A6DA1;"><font style="font-size:18px; font-weight:bold">Formulário de Contato:</font><br />Preencha os campos abaixo para entrar em contato conosco.<br />Não esqueça de seu e-mail para respondermos, se for necessário.<br /><font style="font-size:12px">Os campos marcados com "<font color="#FF0000"><b>*</b></font>" são obrigatórios.</font></p>
<br /><br />
<table border="0" width="450">
<tr>
<td><b>Nome<font color="#FF0000">*</font>:</b><br /><input name="nome" type="text" size="50" maxlength="50" /><br /><i><font style="font-size:10px">máximo de 50 caracteres</font></i></td>
</tr>
<tr>
<td height="60" valign="bottom"><b>E-mail para contato<font color="#FF0000">*</font>:</b><br /><input name="email" type="text" size="50" maxlength="200" /><br /><i><font style="font-size:10px">máximo de 200 caracteres</font></i></td>
</tr>
<tr>
<td height="80" valign="bottom"><b>Assunto (motivo do contato):</b><br /><input name="assunto" type="text" size="50" maxlength="100" /><br /><i><font style="font-size:10px">máximo de 100 caracteres</font></i></td>
</tr>
<tr>
<td height="210" valign="bottom"><b>Mensagem<font color="#FF0000">*</font>:</b><br /><textarea name="mensagem" cols="50" rows="10"></textarea><br /><div align="right"><i><font style="font-size:10px">Criado por <a href="https://ferramentasblog.com/">[ FerramentasBlog.com ]</a></font></i></div></td>
</tr>
</table>
<p style="border-top: 1px dotted #3A6DA1;"><b>Seu contato é muito importante para nós!</b><br />Agora, basta clicar em "ENVIAR" para recebermos sua mensagem.<br /><br /><input name="enviar" type="submit" value="ENVIAR" /></p>
</form>
Onde está indicado de vermelho é para colocar o seu e-mail, exatamente o e-mail que receberá os contatos que forem enviados para você..Cole todo esse código sem mudar nada além de adicionar o seu e-mail, como disse acima, no editor da página que estamos criando. Então clique no botão “PUBLICAR PÁGINA”.
Pedimos que não retire os créditos de criação do formulário.
muito obrigado,há tempo procurava um formulário mais simplificado,testei e adorei!Já está instalado no meu blog.
Parabéns pelas dicas excelentes.
Ótimo. Estava procurando um formulário para blogger de qualidade como esse a tempos.
Marcos, muito obrigado.
Ótimo formulário! Nota 10!!!
Maravilha, mesmo quando eu não sei o que estou procurando, venho até aqui e saio com mais conhecimento, e me aproximo mais de meus leitores.
Só tenho elogios, e rasgação de seda mesmo com vocês.
Mil beijos e obrigado.
Interessante esse modelo, mas uso o formulário do Wufoo e acho ele bastante funcional.
Fantástico esse formulário. Pena que não existe o campo para um site, é um ótimo meio de se conhecer novos locais na internet.
Mas tá muito bom mesmo, parabéns mais uma vez, Lemos.
obrigado pela dica estava mesmo precisandovaleu.otimo trabalho.
Olá Marcos,
Gostei da dica e ainda consegui colocá-la em prática.
Obrigada,
Andrea
Nossa! Assim fica fácil incrementar os nossos blogs. Muito grata! Lais.
Marcos,
Acompanho diariamente seu blog.
Acho seu trabalho muito profissional e de grande qualidade.
Já utilizei várias dicas suas no meu blog.
Quero te agradecer pelo disponibilidade dos códigos e pelas dicas.
Parabéns!
João Tobias
João Tobias
Muit,muito obrigado! Eu estava há muito tempo atrás de um formulário de contatos simples de instalar e ótimo que nem esse. Parabéns,você é demais!
Adorei, desisti de pintar uma parede para navegar na sua quarentena!
Repito só o comentário do Pedro, não como reclamação, porque mais uma vez o Ferramentas do Blog me ajuda, mas como um pedido. Seria legal um campo que indicasse site, página na web!
No mais, parabéns!
Abraços!
Muito bom todo o conteúdo do site. Não precisa sem nenhum expert, para dar uma boa repaginada na sua pág on line. Adorei. Estão todos de parabéns. Mudei a cara do meu blog graças a ajuda de vc's.
Um abraço
OBRIGADA . Nos ajudou muito ja que somos iniciantes no bog da Escola.
Valeu.
Perfeito!!!
Eu tinha um formulário de contato do Wuffo, mas nunca consegui que funcionasse direito.
Parabéns pela qualidade se seu blog e muito obrigada por todas as dicas mais do que importantes que dá aqui!
Abs,
Anne
Valeu! Ja tô usando. Simples e fácil de instalar. Procurei por vários, uns tem que se cadastrar e tomam um bocado de tempo…
Esse é facinho. um abç
Exelente!
Para iniciante como eu foi uma luva.
Não quero copiar ninguem,mais posso ser aluno
valeu mesmo.OBRIGADO
Olá, boa noite!
Estive aqui outro dia e deixei um coment agradecendo o post e parabenizando você.
Acontece que quis dar uma repaginada no blog e tentei instalar este código com o novo template. Pedi para visualizar a página e ela fica linda, perfeita; porém, quando mando publicar, o formulário não aparece, dando lugar ao código. O que pode estar acontecendo?
Um abraço,
Anne
@Anne,
O que pode ter acontecido é que você não colou o código no modo "Editar HTML". Veja os passos descrito acima com mais cuidado para ver o que houve de errado!
obrigada, Marcos, mas não adiantou mesmo!
Estou fuçando no código do template para ver se resolvo, rs!
Abs,
Anne
Oii, fazia seculos q procurava um formulario pro meu blog! Esse é perfeitoo.. Muito obrigada!! Porém estou com um pequeno problema, as mensagens caem direto no lixo eletronico.. 🙁 O email pra onde ta redirecionando é do hotmail.. Obrigadaa, abraços!
Muito interessante esse formulário.
Parabéns, continue o bom trabalho!
Amigo
espetacular a dica e a didática.
valeu, ja estou usando.
Oi Marcos,
eu uso o seu formulário no meu site. Realmente ótimo e muito fácil de ser "instalado", até pra mim que sou 0,5 nerd, numa escala de 1 a 100.
O único problema é que ele não reconhece acentos e cedilhas… muitas mensagens vem praticamente "criptografadas"!
Abraços,
Camilli
Valeu galera. Show o formulário e o crédito é de voces, então ficará por lá.
eu ja disse que voces jão genios??? rs…
vlw mesmo!
Muito bom esse trabalho!
Nos ajuda e muito. Só fiquei com um dúvida aqui: Só pode adicionar emails.com? Será que funciona com email.com.br?
Funciona com qualquer serviço de email, seja .com ou .com.br ou qualquer outro que vc quiser.
Ótimo excelente adicionado no meu blog testado e funcionando
obrigada pelo post. o seu blog é genial, tem-me ajudado imenso no processo de remodelação da minha página!
Adorei a dica, muito legal mesmo. Há um bom tempo eu procurava um código para um formulário de contatos.
Nossa! maravilhoso, deu certo, obrigada, vlw, bjus
Estou testando para ver se funciona, a instalação foi perfeita, agora quero ver se consigo receber as mensagens, qualquer coisa volto aqui, bjuuuus e obrigada.
Brother, mt fera a dica, já coloquei no meu blog e está atodo vapor. Deus abençoe seu trabalho.
Muito obrigada, Marcos!!! Esse formulário é justamente o que procurava! Troquei meu formulário feito no google doc por este, na hora!
Muito bom mesmo, só tem um problema, quando é colocado acentos ele não reconhece..
Mas no demais. ótimo mesmo
Excelente! Já adicionei no blog! E deixei os créditos também!
Parabéns!
Muito obrigado pelas dicas, eu que não entendo muito de informática, mais com a sua ajuda ficou muito fácil colocar o formulário no meu blog
Eu até tentei criar um E-book digital mais a falta de experiência não me deixou levar o projeto do livro digital, foi então que eu resolvi criar esse blog com os arquivos do livro
Se possível faça uma visita ficarei muito grato
E muito obrigado pela força.
Cara, realmente tive problemas para colocar na página, mas mesmo assim consegui colocar como postagem, o mais simples, direto, fácil e ótimo formulário que encontrei.
BRIGADÚÚÚÚ!!!
Valeu Pelo Codigo =D Muitas vezes eu retiros o creditos mas quando é do [ FerramentasBlog.com ] eu dexarei porque é melhor conteudo de dicas de Blog valeu!
Muito Show, usei no meu bolg e está dando um resultado legal.
Obrigado!
Marcio Ribeiro
Ah gato !
vlw, a coisa funciona meesmo!!
Mandou mto bem.
Parabéns. Vou assinar o feed de vcs, tipo, AGORA!
Bju
Obrgidoa, esta precisando mesmo de um desse !!Deus esteja te abençoada ecuidado de vc.
Super obrigada!! Realmente faltava essa pagina no meu blog! Deus o abençoe!
Poxa, comecei sexta a fazer meu blog e com esta dica, muito simples por sinal, meu blog vai ficar SHOW!!!
Não tem nem como pensar em tirar o seu crédito, pelo contrário, o crédito é mais do que merecido. Parabéns e adorei o seu blog.
Boa Noite Te agradeço Muito pela dica ai do formulário de contato coloquei em meus blogs testei e tudo ok.já a dias estava tentando outros e não conseguia Que te abençoe.
O Salvador da minha pátria! Finalmente um formulário simples de ser feito (se bem que já tá feito) e colocado no blogger! Valeu Mesmo!
O melhor formulário que encontreim quanto aos creáditos não só deixei em minha página como já divulguei p amigos.
parabens
PS vou explorar ainda mais seu site
Procurei vários formulários na internet. Mas só este é bem prático, leve e fácil de usar.
Valeu aí.
Adorei! Era isso que eu estava procurando há tempos!!! Vc é ótimo no que se propõe, PARABÉNS!!!
Adliz Jamile
Amei esta dica. Parabéns.
Já levei a idéia para meu blog.
Deus te abençoe.
Valeu Cara!! Todas as suas dicas desde como colocar o ícone de redes sociais ao formulário são as melhores. Ótimas, objetivas e ilustrativas no passo-a-passo. Valeu mesmo.
Muito bom… Há tempos que estava procurando um Formulário decente.
Já testei vários e sempre dando erro. O seu funcionou certinho e na hora.
Parabéns… e obrigada por nos ajudar.
Já estou te seguindo…
Valeu amigo!
Grande abraço.
pUXA… Estou acompanhando o seu blog há uma semana, e o meu blog está ficando maravilhoso graças a voce! Adorei todas as dicas e a forma como explica, é fácil e didática
Até que eu queria colocar esse formulário em meu blog, mais nesse layout não deu certo, tive que tirar.
Mais valeu pela dica, Esse formulário funcionou certinho no template antigo.
abraço
Puxa, estou fazendo um blog novo e deu direitinho. Sua explicação está maravilhosa. Obrigada mesmo!
Estava procurando um formulário, mas só encontrava formulários difícil de se compreender e em sites escrito em inglês, muito obrigado, você facilitou muito minha vida, vou seguir o blog com todo prazer.
Espero meu blog ficar famoso algum dia
Esse formulario é perfeito… editei algumas coisas para ficar como eu quero.. e pronto !
parabens esse site é 10 !!!
AEEEEEE!!!!!
Mandei um pro meu!!!
BRIGADÃO, CUMPADI!!!!
Os créditos estão lá! Muito bom! Obrigado!!!
Visito frequentemente seu blog, e acho fantástico tudo o que você faz! Criei o meu blog e acho que vou adicionar uma página de tutorias blog, os temas que eu postar, vou redirecionar para os blogs que eu sempre uso para aprender. Pois o meu blog não é de ferramentas para Blog, mas acho interessante ter links para blogs como o seu que é de grande ajuda e sempre me socorre. visito sempre, tenho aprendido muito com você.
E os créditos do formulário vão para você! :o)
Abraços!
Pingback: Biografia do autor do Blog no rodapé dos posts para Blogger | [ Ferramentas Blog ]
haaa muito obg! Adorei o form *–*
Eu uso o seu formulário e às vezes recebo mensagens.
Devo trocar?
Abraço
Sim, Fátima.
Deve trocar pois o funcionamento deste está comprometido.