Como criar um formulário de contato com o Wufoo

Postado em 12. abr, 2009 por Rodrigo em Tutoriais

Criar formulário contato blog

Sempre tive problemas com formulários para Blogger. Já usei o Formulário PRO, mas recebia muito spam através dele. Depois mudei para o Contactfy, mas aí passou a ser pago. A saída foi usar o Kontactr, que apesar de funcionar bem tinha um probleminha: não reconhecia mensagens com acento! Ler textos recebidos pelo Kontactr era um verdadeiro martírio, tinha que ir decifrando o que significava as palavras (comentário, continuação, etc)

Como estava usando o Kontactr e não recebia muitos emails continuei a usá-lo. Acontece que agora as visitas no Design Tecnológico aumentaram bastante nos últimos meses e por conseqüência o formulário de contato está sendo bem mais utilizado, ficando inviável a leitura das mensagens devido à esse bug em palavras acentuadas no Kontactr.

Resolvi procurar no Usuário Compulsivo, para ver se tinha alguma novidade em se tratando de formulários, mas não encontrei nada. Então parti para uma busca no Google e encontrei o Wufoo. Já tinha ouvido falar dele, mas nunca tive a curiosidade de testá-lo.

Eis que hoje resolvi experimentar o serviço que me surpreendeu bastante pela facilidade e profissionalismo que é o resultado final do formulário.

Como fazer um formulário de contato com o Wuffo

Acessando o Wuffo você precisa primeiro se registrar para poder Criar o Formulário de Contato. É um registro bem simples: nome, email e senha.

A próxima tela você tem que optar pela opção “Free” onde você tem direito a cadastro de 1 usuário, criação de 3 formulários, 3 relatórios e 100 mensagens por mês. Caso queira mais que isso, você precisa fazer o upgrade da sua conta optando por algum dos planos pagos.

Depois de se logar, já no “palco de trabalho” você vai definindo o que você quer adicionar ao seu formulário. Como estava fazendo um formulário de contato adicionei apenas um campo Name, Email, Web Site e um Single Line Text (é o campo para mensagem). Além desses campos ele conta com vários outros, como por exemplo, telefone, chechboxes, drop down, multiple choice, etc. Utilizar esses componentes vai de acordo com o tipo de formulário que você quiser desenvolver.

Agora que já temos nosso formulário pronto, precisamos configurar as propriedades de cada campo clicando na aba “Field Settings”.

Clicando sobre cada campo de seu formulário de contato aparecerá a janela de configuração do campo. Nessa janela você pode alterar o nome do campo (por exemplo, alterar Name para Nome), selecionar se o campo é obrigatório ou não, colocar notas sobre o que deve ser preenchido no campo, etc.

Cada componente tem suas propriedades peculiares, cabendo a você configurar da maneira que melhor lhe convier.

Agora que já temos nosso formulário e já configuramos todos os componentes precisamos configurar nossas propriedades do formulando clicando na aba “Form Settings”. Nessa janela de configurações nós customizaremos o cabeçalho do nosso formulário, ou seja, daremos o nome (por exemplo, “Formulário de Contato do Blog do Fulano de tal”), selecionar a linguagem, colocar uma descrição, alinhamento, mensagem de agradecimento pelo contato, etc.

Depois de feito tudo isso nosso formulário está QUASE pronto. Salve o formulário!

Já colocamos os campos no formulário, já configuramos cada um deles e customizamos nosso cabeçalho, mas ainda falta um passo muito importante: Informar o email para onde será enviado o comentário. Faça o passo 4, que está explicado logo abaixo.

Depois de salvar seu formulário você verá um painel de administração onde tem os campos:

1 – “Entries” (Mensagens enviadas através do formulário);

2 – “Edit” (Local onde você poderá editar seu formulário. Mesmo o código do formulário já estando em seu blog, acessando esse painel de configuração se você fazer alguma alteração em seu formulário, essas alterações serão atualizadas no formulário do seu blog, sem a necessidade de precisar gerar outro código e trocar no blog);

3 – “View” (Exibe um preview de como ficará seu formulário);

4 – “Notifications” (Você escolhe a forma que você quer receber suas notificações. Você pode escolher por email, via telefone celular ou via feed. Eu optei receber por email, então na aba “Email” adicionei a conta de email que eu queria receber as notificações);

5 – “Code” (Aqui você pode copiar o código para inserir em seu blog ou site. São disponibilizados vários tipos de código. Você pode optar por um código em forma de link onde seu formulário abre em outra janela, pode pegar um código para inserir no corpo de um post (eu optei por esse), pode abrir em uma página inteira do seu site, em forma de pop-up, XHTML/CSS, etc);

5 – “Payment” (Nessa opção você pode fazer o upgrade da sua conta para um dos planos pagos do Wufoo que dão direito a mais espaço para mensagens, criação de mais formulários, mais relatórios, etc).

O Wufoo é, sem dúvida, uma excelente aplicação para fazer formulários de contatos, e está funcionando muito bem no Blogger. Se você tem alguma outra sugestão de formulários pode deixar logo abaixo nos comentários.

Rodrigo
Sou o idealizador do Design Tecnológico. Formado em Sistemas de Informação e pós-graduado em Segurança. Apaixonado por tecnologia e internet.

7 Comentários to “Como criar um formulário de contato com o Wufoo”

  1. Renatha Shen

    06. jun, 2009

    muito bom, muito pratico

  2. Missões e Adoração

    05. jul, 2009

    Obrigado pela dica. Já está funcionando

  3. carlos

    30. nov, 2009

    muito bom post!!!

  4. Anonymous

    30. nov, 2009

    Muito bom o wufoo!!

  5. Weverton

    23. fev, 2010

    Gostaria de saber como faço para colocar o formulário criado no wufoo no blogger. Obrigado.

    • Rodrigo

      24. fev, 2010

      Depois de criar o seu formulário é só gerar o código para Blogger e inserir no template!

  6. Alberis Luís

    12. mar, 2010

    É o mais eficiente que já encontrei.