Dicas para Blogs e Sites

É possível fazer uma pagina de contato no blog usando o novo gadget de formulário de contato do Blogger. Normalmente esse acessório é para ser utilizado na sidebar (barra lateral) do blog, mas a maioria dos blogueiros prefere usar o formulário de contato numa pagina estática do blog, mas por enquanto ainda não existe essa opção no Blogger, mas podemos fazer isso mexendo em algumas linhas de HTML do formulário de contato.

Fazer uma pagina de Contato no Blogger

O primeiro passo para criar uma pagina de contato no seu blog é adicionar o novo gadget oficial com formulário de contado do blogger. Depois disso entre na pagina modelo, faça um backup do seu template e localize o trecho do HTML do formulário de contato.

Para achar o código HTML use o Ctrl F ou simplesmente clique no menu suspenso "ir para o gadget". Nestas duas opções você deve procurar por ContactForm1, clicar nas setinhas laterais para expandir o HTML do blogger e apagar as linhas de código que estão depois de <b:includable id='main'> e antes de  <b:include name='quickedit'/>, mas não apague essas linhas que mostramos você deve apagar somente o que está entre elas.


Clique para salvar as alterações no modelo, crie uma pagina estática no seu blog usando esse código:

<style type="text/css">
.contact-form-name, .contact-form-email, .contact-form-email-message, .contact-form-button-submit {
width: 100%;max-width: 100%;
margin-bottom: 10px;
}
.contact-form-button-submit {
width: 100%;
font-size: 12pt;
height:40px;
float: right;
color: #000;
}
</style>
<form name='contact-form'>
Nome
<br/>
<input class='contact-form-name' id='ContactForm1_contact-form-name' name='name' type='text' value=''/>
E-mail
<span style='font-weight: bolder;'>*</span>
<br/>
<input class='contact-form-email' id='ContactForm1_contact-form-email' name='email'type='text' value=''/>
Mensagem
<span style='font-weight: bolder;'>*</span>
<br/>
<textarea class='contact-form-email-message' id='ContactForm1_contact-form-email-message' name='email-message' rows='5'></textarea>
<input class='contact-form-button contact-form-button-submit' id='ContactForm1_contact-form-submit' type='button' value='Enviar'/>
<div>
<p class='contact-form-error-message' id='ContactForm1_contact-form-error-message'></p>
<p class='contact-form-success-message' id='ContactForm1_contact-form-success-message'></p>
</div>
</form>

Não se esqueça de colocar o titulo da pagina de contato, além disso, veja nas opções da pagina se está marcado para executar o HTML (interpretar HTML digitado). Clique em publicar e já está concluído.

Personalizar Formulário de Contato no Blogger

Você notou que o inicio do código que usamos na pagina estática tem um estilo CSS (código para formatar texto e paginas):

E desta forma pode ser alterado como você desejar, ou seja, você pode trocar as cores e tamanho da fonte, colocar cores de fundo ou bordas, veja os links abaixo:
Código das Cores
Colocar ou alterar as bordas
Formatação Especial nos Textos das Postagens

Lembrando que a caixa do formulário de contato é o estilo: .contact-form-name, .contact-form-email, .contact-form-email-message, .contact-form-button-submit

E o botão enviar é .contact-form-button-submit, portanto você pode modificar isso como desejar para que combine melhor com o seu template.

Com isso já está tudo pronto e seu blog já tem uma pagina de contato personalizada usando o gadget padrão do blogger para que seus visitantes possam enviar mensagens (email) diretamente para você. E aproveitando que o assunto é aumentar a comunicação com seus visitantes veja também:
O que as Pessoas Gostam e Procuram em Blogs e Sites
Quais os Melhores Assuntos para Blogs: o que Faz mais Sucesso
Diversas Enquetes sobre Blogs
Verificar e Corrigir Erros e Problemas Comuns em Blogs

Para terminar apenas um aviso embora no lugar que adicionamos o gadget na sidebar do blog não apareça nada você não pode retirar o gadget, pois ele ativa alguns códigos que permitem o envio do formulário de contato, ou seja, se apagar o gadget o formulário continuará aparecendo na sua pagina de contato, mas não funcionará.

Marcadores: Acessórios, Gadgets