Como criar um formulário de contato gratuito para colocar no seu blog ou site
byALF | 
quinta-feira, junho 22, 2017
Formulário de contato gratuito
Neste artigo vamos mostrar como criar um formulário de contato com os seus leitores para você inserir este formulário no blog ou site que você administra.
O formulário de contato é um elemento essencial para o seu blog. Com ele você cria um canal direto com os seus leitores, podendo receber sugestões, críticas e informações que podem ajudar você a melhorar o conteúdo, layout e navegabilidade do seu blog.
Veja a seguir como criar um formulário de contato simples com o aplicativo JotForm:
Criando um formulário simples com JotForm
Clique [SIGN UP] para fazer o cadastro gratuito.
Preencha o formulário e clique no botão [CREAT MY ACCOUNT].
Clique no botão [SKIP].
Entre no seu navegador de e-mail e na mensagem do JotForm clique no botão [Verify Now].
Clique em [Let’s go!].
Você será redirecionado para a página de criação do formulário.
Clique em [Adicionar Elemento] para inserir os elementos do seu formulário…
Como nosso formulário será o mais simples possível, vamos acrescentar somente os campos Nome Completo, E-mail, Assunto, Mensagem e Código Captcha (código de segurança).
Observe que o aplicativo permite itens BÁSICOS, PAGAMENTOS e WIDGETS. No nosso exemplo vamos utilizar apenas elementos básicos. Depois, você poderá testar elementos mais avançados no seu formulário de contato.
Para criar o nosso primeiro elemento, “Nome Completo”, arraste o elemento Entrada de Texto Curta para o campo “Arraste sua primeira pergunta da esquerda para cá”.
Clique no ícone para configurar o elemento…
Na guia Geral, digite o nome do campo em Texto da Pergunta, defina o alinhamento em Alinhamento do Rótulo e se o campo é obrigatório deixando Obrigatório como SIM.
Depois na guia OPÇÕES, defina o tamanho do campo. Se desejar, clique em Largura para definir o número máximo de caracteres permitido.
Na guia AVANÇADO, você poderá ainda inserir outros recursos como Controle de Conteúdo, Texto Ajuda, Valor Pré-definido e opção para Somente Leitura.
Depois de configurado o nosso primeiro elemento, volte para o menu [Adicionar Elemento].
Da mesma forma que o elemento anterior, arraste e configure os elementos E-mail e Entrada de Texto Longa.
Obs.: Se você inseriu um elemento fora de posição, não se preocupe. Basta arrastar o elemento para a posição desejada…
Obs.: Não esqueça de deixar todos campos como obrigatório.
Finalmente, vamos colocar o último elemento do nosso último elemento, o código de segurança Captcha.
Se deseja, altere o nome do Cabeçalho.
Se desejar, clique em [+Add Your Logo] para inserir o logo do seu site.
Carregue o arquivo da logomarca,
Veja como está ficando nosso formulário.
Alterando o layout do formulário
Para alterar o layout do formulário, clique no ícone com um rolo de pintura.
Você poderá alterar as Cores, Estilo, CSS (Folha de estilo para HTML) e Temas.
No nosso exemplo vamos adicionar o tema Brick Wall que aparece em Feature Themes.
Para remover o tema, passe o mouse sobre Tema Atual e clique em [Remover Tema].
Observe que quando você altera o tema do layout, é necessário inserir novamente a logomarca. Clique novamente em [+Add Your Logo] e carregue o arquivo da logomarca.
Visualizando o seu Formulário
Clique no botão Pré-visualizar formulário.
Na figura abaixo, veja como ficou o nosso formulário:
Para voltar ao editor, clique novamente Pré-visualizar formulário. Faça as alterações que desejar.
Outras Configurações
Você poderá fazer configurações do formulário como status, condições, e-mails, integrações e página de agradecimento.
Para alterar os e-mails para o recebimento dos dados, clique em [EMAILS].
Observe que o e-mail de NOTIFICAÇÃO1 é o e-mail que você cadastrou no site. Para alterar clique no ícone com formato de lápis. Para acrescentar outros e-mails, clique no botão [ + ].
Teste os recursos para conhecê-los melhor.
Publicando o formulário no blog ou site
No menu superior, clique em [PUBLICAR].
Na guia lateral acesse [INCORPORAR]. Em INCORPORAR, clique no botão [COPIAR]. Depois cole o código no blog ou site.
Se desejar, teste antes o código como mostramos a seguir…
Testando o formulário no Squids Editor
Cole o código que você copiou no lado esquerdo do editor. Clique no botão [Executar].
Preencha os dados do formulário e envie para verificar se você está recebendo as informações.
Depois de enviar a mensagem, abra o seu e-mail e verifique se recebeu os dados.
Verificado seu formulário, copie e cole o código no seu blog ou site.
Veja abaixo como ficou o nosso formulário. Aproveite para mandar uma mensagem para nós…
Editando seu formulário de contato
Se você não estiver logado, faça o login. Vá em [Meus Formulários] e clique sobre o formulário que deseja editar.
Clique em [Editar].
Faça as alterações desejadas.
Observação: Não é necessário copiar e colar novamente o código do formulário. Toda alteração no formulário é realizada em tempo real onde o código foi inserido.
Criando um novo formulário
Em Meus Formulários, clique no botão [Criar formulário].
Obs.: Se você não foi direcionado para a página abaixo, acesse o link: www.jotform.com/myforms
Clique no botão [Criar].
Observação: Se desejar, você poderá utilizar um modelo pronto clicando [Selecionar].
Dê um nome para o seu formulário. Clique em [Continue].
Aguarde alguns instantes. Clique em [Add Form Element] para inserir os elementos do seu formulário como já mostramos antes..
Preços e Planos
Se você deseja algo mais, veja todos os planos do JotFom: JotForm Preços.
O Plano FREE permite a criação de até 5 formulários com no máximo 1.000 visualizações.
0 comentários:
Postar um comentário