segunda-feira, 6 de dezembro de 2010

Dicas para Blog - Formulário de Contato

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:

pagina-estatica-blogger-menu

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:

edito-pagina-estatica-editar-html

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:

ignorar linhas

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!

Thiago Girardi Thiago Girardi é o fundador do blog do gita! Compositor, Escritor, Amante da Boa Música, Fanático por Tecnologia e Viciado em Computadores! Criou este blog com objetivo de levar conhecimento a todos, com informação e entretenimento. Leia mais sobre o autor...

Nenhum comentário:

Postar um comentário

Seu comentário é sempre muito bem vindo!
Comente, opine, se expresse! Este espaço é seu!

Se quiser entrar em contato, utilize o Formulário de Contato.

Espero que tenha gostado do Blog e que volte Sempre!