Bom pessoal, essa é a minha primeira postagem, e de início vou falar sobre um recurso que já estou usando aqui no meu blog que é o "Formulário de Contato" onde eu encontrei na internet! Muito útil para criar um vínculo com os leitores! Todos podem adicionar esse formulário usando o recurso padrão do Blogger de página estática, sem limite de mensagens!
O processo é bem simples, visto que se trata de um Formulário bem eficiente!
Um exemplo de como ficará está na minha própria página de Contato!
Agora vamos ao que interessa!
Passo 1 – Preparando a página estática.
A
primeira coisa a se fazer é criar uma página estática. Para isso vá ao
painel do Blogger, clique no menu "Postagem" - "Editar páginas" e por último no botão "NOVA PÁGINA". Como mostra a figura a seguir:
O
que vai abrir é o editor de Posts padrão do Blogger. Dê um título para essa página ( como por exemplo a minha: "Contato" ) e clique na aba "Editar HTML" do editor, como mostra a figura a seguir:
Isso
é importante, pois a única coisa que você vai precisar fazer é colar o
código do formulário aí. Mas não é só isso. Veja que na base do
editor há um link que diz "Opções de postagem". Clique nele para 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 contato.
Passo 2 – Adicionando o código HTML
Na área de texto do editor, cole o seguinte código HTML e só mude o que estiver em
Vermelho!
Eis o código:
<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>
<br />
<form action="http://www.ferramentasblog.com.br/templates/formmail.php" method="post" name="FormContato" onsubmit="return verifica();">
<input name="receber" type="hidden" value="
SEU E-MAIL AQUI" />
<br />
<div style="border-bottom: 1px dotted rgb(58, 109, 161);">
<span style="font-size: 18px; font-weight: bold;">Formulário de Contato:</span><br />
Preencha os campos abaixo para entrar em contato comigo.<br />
Não esqueça de colocar seu e-mail caso haja necessidade de resposta!.<br />
<span style="font-size: 12px;">Os campos marcados com "<span style="color: red;"><b>*</b></span>" são obrigatórios.</span></div>
<br />
<br />
<table border="0" style="width: 450px;">
<tbody>
<tr>
<td><b>Seu nome<span style="color: red;">*</span>:</b><br />
<input maxlength="50" name="nome" size="50" type="text" /><br />
<i><span style="font-size: 10px;">máximo de 50 caracteres</span></i></td>
</tr>
<tr>
<td height="60" valign="bottom"><b>Seu e-mail para contato<span style="color: red;">*</span>:</b><br />
<input maxlength="200" name="email" size="50" type="text" /><br />
<i><span style="font-size: 10px;">máximo de 200 caracteres</span></i></td>
</tr>
<tr>
<td height="80" valign="bottom"><b>Assunto ( motivo do contato ):</b><br />
<input maxlength="100" name="assunto" size="50" type="text" /><br />
<i><span style="font-size: 10px;">máximo de 100 caracteres</span></i></td>
</tr>
<tr>
<td height="210" valign="bottom"><b>Mensagem<span style="color: red;">*</span>:</b><br />
<textarea cols="50" name="mensagem" rows="10"></textarea><br />
<div align="right">
<i><span style="font-size: 10px;"></span></i></div>
</td>
</tr>
</tbody></table>
<div style="border-top: 1px dotted rgb(58, 109, 161);">
<b>Seu contato é de extrema importância!</b><br />
Agora, basta clicar em "ENVIAR" para finalizar o processo.<br />
<br />
<input name="enviar" type="submit" value="ENVIAR" /></div>
</form>
Mude apenas o que está em
Vermelho, que é onde você deve colocar o e-mail para onde as mensagens de contato devem ser enviadas! Feito isso, clique em "Publicar Página" e pronto, é só conferir o resultado!
Não esqueça de deixar o seu comentário!
