08 abril 2010

Como o blogger ainda não incluiu um formulário de contato nativo, temos que adaptar algumas maneiras para que isso seja feito. Há alguns tutoriais na web com widgets e serviços que funcionam de forma satisfatória, porém, neste tutorial, irei ensinar como usar o próprio google para realizar essa tarefa.


Google docs

O googledocs é uma suite de aplicativos assim como o Microsoft Office e o BrOffice (gratuito), com a vantagem de funcionar online direto do browser e de ser gratuito.

1º passo

Acesse o site do Google docs e faça seu login.
Fomulário de contato no blogger com o google docs

2º passo

Clique em criar novo e selecione formulário.

Fomulário de contato no blogger com o google docs

3º passo

Neste passo, iremos configurar nosso formulário. Entenda a estrutura e como irá funcionar:

Fomulário de contato no blogger com o google docs
Nosso formulário terá 4 campos sendo eles: Nome, Email, Site e Mensagem.

Os dois primeiros campos da imagem acima que eu não numerei são auto explicativos. Você define um título e se quiser um texto de informação sobre o formulário.

  • 1- Define o texto do campo. Deixe-o como nome.
  • 2- Texto adicional, que pode ser usado como observação ao usuário. Escreva (obrigatório).
  • 3- Define o tipo do campo, se é texto, número e etc. Deixe-o como está.
  • 4- Define que é obrigatório o preenchimento do campo. Caso contrário, se o usuário não escrever nada e esse campo não tiver sido marcado, o conteúdo será enviado em branco.
Após configurar nosso primeiro campo clique em concluído. Repita esse processo nos 3 primeiros campos. No último campo, que será o de mensagem, basta substituir o passo 3 de texto para texto do parágrafo. Observação: Por padrão, o google já adiciona 2 campos para que possamos editar. Para adicionar novos campos é só acessar adicionar item e selecionar o tipo desejado.

Após o término da configuração, teremos algo como isto:
Fomulário de contato no blogger com o google docs

4º passo

Com o formulário pronto é só incorporar em nossa página no blogger. Clique no botão mais ações e selecione incorporar.

Fomulário de contato no blogger com o google docs
Copie o link da janela.

Fomulário de contato no blogger com o google docs
Com o link copiado, vá até seu o blogger, crie uma página estática e adicione o link na postagem. Salve e veja o resultado.

Abaixo o resultado aqui no blog.

Fomulário de contato no blogger com o google docs Formulário aplicado no Crianerd.
As mensagens enviadas por este formulário irão parar o seu arquivo salvo no google docs. Para ver as mensagens, basta abrir o documento correspondente ao formulário e checar se alguém lhe escreveu.

Fomulário de contato no blogger com o google docs Painel com as mensagens enviadas pelo formulário.
Diga-me o que achou e se lhe foi útil. Deixe sua dúvidas nos comentários para que eu possa ajudar.

Update 09/13

O usuário FAMA deixou a dica de como ser notificado ao receber uma mensagem, confira:

No Google Docs, clique no seu formulário e Selecione no menu Tools -> Notification Rules / Ferramentas -> Regras de Notificação, clique Um usuário enviou um formulário / A user submits a form Notify me with - Me notificar por Por email Imediatamente / email - right away

21 comentários

Simples é funcional. Amo muito tudo isso.

Reply

@Anônimo - Uso o google docs justamente por isso. Acho simples e serve ao propósito. Obrigado pela visita e pelo comentário.

Reply

@Clube da Educação - Que bom que gostou.

Reply

Complementando o ótimo post.

Você pode receber um aviso por email se alguém enviar um formulário para você. Siga os passos abaixo (Não sei a tradução exata para o português, mas deve ser algo próximo disso).

No Google Docs, clique no seu formulário. ele vai abrir a tabela e lá Selecione no menu

Tools -> Notification Rules / Ferramentas -> Regras de Notificação

Clique
Um usuário enviou um formulário / A user submits a form


Notify me with - Me notificar por
Por email Imediatamente / email - right away

Reply

Parabéns Helder pelo Post,
e tbm ao @FaMa, que o completou muito bem, chegando ao ponto que iria perguntar. Parabéns

Reply

Thiago - Obrigado amigão. O fama complementou muito bem mesmo. Vou atualizar o post e incluir o complemento dele.

Reply

Helder

Adorei seu tutorial, mas quando posto o fomulário fica grande no blog. Como faço pra ficar ajustado a página?

Eliza Braga

Reply

Obrigada pelas dicas, foram muito úteis. E o Fama tb ajudou...

Reply

Foi utilissimo,vc salvou minha pele

obrigada

Reply

Cara, agora você salvou a pátria... VAleu!

Reply

Parabens.

Foi-me mesmo muito util.

Obrigadão

5*****

Reply

Nossa,
tava me batendo toda pra colocar no blog
suas dicas foram otimas
muito obrigado!

Reply

Finalmente um formulário bom para o meu blog! Muito obrigada! Ótimo post =]

Reply

muittoooo bommmm .. ja coloquei no meu site XD
obg

Reply

Muito obrigada pelas dicas! Super bem explicado, vc está de parabéns!!!

Reply

Otimo, me ajudou bastante, adorei. Beijos

Reply

Muito obrigada pelas informações que encontrei aqui.
Tentei em outros lugares e só consegui aqui.

Reply

Olá amigo,
gostei muito do tutorial, porém na hora de posta-lo em meu blogspot. exibe o erro 404 e no local da caixa aparece a tag do link. poderia me dizer o que pode ser? Desde já agradeço.
Abração

Reply

Ajudou muito...
pode seguir ?
www.garotasasolta.blogspot.com
já estou seguindo !

Um abraço

Reply