Precisa de ajuda? Temos aqui as informações que você precisa!

Página Inicial da Base de Conhecimentos aero-right Formulários de Inscrição aero-right Como crio um formulário de inscrição para o meu site?

Como crio um formulário de inscrição para o meu site?

Formulários de Inscrição Atualizado em Março 19, 2021

Formulários de inscrição são uma maneira excelente de capturar contatos em um site ou nas mídias sociais. Há diferentes formulários que você pode criar com a Benchmark Email e neste artigo vamos ensiná-lo como criar e utilizar cada tipo de formulário.

Clique abaixo no formulário que você deseja utilizar:

Antes de prosseguir, é importante se atentar ao seguinte:

  • Contas gratuitas têm o limite de 75 inscrições por dia
  • Contas Premium não têm limite de inscrição.
  • O novo Formulário Incorporado substitui o Formulário Clássico na nova interface. Ele possui as mesmas funcionalidades do formulário clássico.
  • Formulários Incorporados, como o próprio nome sugere, se adaptam ao layout do site. Eles ficarão posicionados entre outros elementos ou seções do site.
  • Se você deseja deletar algum campo do seu formulário de inscrição, abra o editor e passe o mouse sobre a parte que deseja deletar. Ao visualizar o ícone de lixeira, clique para deletar.
  • Em setembro de 2018, muitos serviços do Google foram bloqueados na China continental. Devido às restrições, o reCaptcha pode não funcionar corretamente nessas regiões chinesas afetadas. Saiba mais sobre o assunto clicando aqui.
  • Formulários Javascript (com rastreamento de site): As alterações ou atualizações feitas em um formulário Javascript aparecerão automaticamente no formulário do seu site.
  • Formulários HTML (com rastreamento de site): As alterações ou atualizações feitas em um formulário HTML não serão exibidas automaticamente no formulário em seu site. Para que as alterações sejam exibidas, você precisará Salvar & Publicar o formulário novamente, copiar o novo código HTML e, por último, colar o novo código em seu site.

 

Formulários Incorporados

Para utilizar este formulário de inscrição, faça o seguinte:

  1. Na tela principal da Benchmark, selecione Contatos.
  2. No menu, clique em Formulários de Inscrição.
  3. Em seguida, no lado direito da página, clique no botão Criar Formulário de Inscrição.
  4. Selecione Formulário Incorporado e clique em Próximo. Dê um nome ao formulário, selecione uma lista de contatos e clique em Salvar & Próximo.
  5. Crie e edite o seu Formulário de Inscrição.
    • Você pode editar a mensagem de confirmação de inscrição clicando em Configurações de Opt-in, no canto superior esquerdo.
    • Altere a aparência do seu formulário ou adicione campos adicionais ao passar o mouse sobre o formulário de inscrição e clicando no ícone de mais opções (···).
  6. Quando terminar, clique em Salvar & Publicar.
  7. Em seguida, o código do formulário de inscrição aparecerá, selecione o tipo de código desejado (Javascript ou HTML), copie e então cole no seu site.

Importante

  • Caso você não defina a largura em pixel, o formulário preencherá 100% do espaço.
  • A largura máxima do formulário de inscrição em uma área de trabalho é 999px. No entanto, se o formulário de inscrição for aberto em um dispositivo móvel, o formulário será preenchido automaticamente, de acordo com o tamanho da tela.

O que você pode personalizar

  • Você pode adicionar uma largura personalizada, se achar necessário. Apesar disso, não recomendamos fazer alterações na largura. Por padrão, o formulário ocupará 100% do espaço em que estiver incorporado.
  • Você pode alterar a cor de fundo, adicionar uma borda ao seu formulário e definir um raio de canto, que é o arredondamento da borda.
  • Clique no seu formulário para adicionar imagens, texto, spacers (espaçadores), personalizar o cabeçalho, os campos e o botão do formulário de inscrição.
  • No Formulário Incorporado, você pode adicionar quantos campos quiser, mas recomendamos mantê-lo simples.

Precisando de inspiração? Veja alguns formulários de inscrição que foram criados na Benchmark.

Voltar ao topo

 

Pequenos Formulários Incorporados

Antes de prosseguir, é importante se atentar ao seguinte:

  • A largura depende de onde você decidir incluir o formulário de inscrição no seu site.
  • O Pequeno Formulário Incorporado coleta apenas endereço de email, nome e sobrenome.

Saiba como criar um formulário como este:

  1. Faça login na sua conta Benchmark.
  2. No painel principal, selecione Contatos.
  3. Depois disso, clique em Formulários de Inscrição no menu.
  4. No lado direito da página, clique no botão Criar Formulário de Inscrição.
  5. Selecione Pequeno Formulário Incorporado e depois clique em Próximo.
  6. Dê um nome para o seu formulário e selecione uma lista de contatos.
  7. Clique em Salvar & Próximo.
  8. Crie e edite o seu formulário.

Ao finalizar, clique em Salvar & Publicar. Em seguida, o código do formulário de inscrição aparecerá, selecione o tipo de código desejado (Javascript ou HTML), copie e então cole no seu site.

O que você pode personalizar

Como este é um formulário de tamanho compacto, ele é limitado a apenas 3 campos: O de primeiro nome, o de sobrenome e o campo de email. Este formulário não suporta imagens.

  • Você pode adicionar uma largura personalizada, se achar necessário. Apesar disso, não recomendamos fazer alterações na largura. Por padrão, o formulário ocupará 100% do espaço em que estiver incorporado.
  • Você pode alterar a cor de fundo, o cabeçalho, o estilo do botão.
  • No Formulário Incorporado, você pode adicionar quantos campos quiser, mas recomendamos mantê-lo simples.

Precisando de inspiração? Veja alguns formulários de inscrição que foram criados na Benchmark.

Voltar ao topo

Como configurar o Pequeno Formulário Incorporado na horizontal

Os pequenos formulários incorporados permitem apenas 3 campos, que são Nome, Sobrenome e Endereço de Email, e é por isso que recomendamos alterar o código apenas deste modelo de formulário. Recomendamos também que você mantenha apenas dois campos. Se considerar necessário e o design de seu site ou página permitir, você pode habilitar também o campo de sobrenome.

Siga as etapas abaixo para configurar o Pequeno Formulário Incorporado na horizontal.

Começaremos na ferramenta de Formulário de Inscrição

Para criar o formulário horizontal, é necessário ter um pequeno formulário incorporado já criado.

  1. Quando a edição do formulário estiver concluída, você pode clicar em Salvar e Publicar.

  1. Confirme as alterações e, na janela popup, clique no menu suspenso e selecione a opção Código HTML.
  2. Clique na opção de Copiar. Ao clicar nesta opção, você copia o código inteiro.

  1. Feche a janela popup e retorne para o painel principal da Benchmark clicando no logo na parte superior esquerda.

O processo agora continuará dentro do nosso Editor de Código. Esta parte é opcional, você pode utilizar apenas um editor de textos.

  1. Agora, vá até a página com a lista de seus Emails.
  2. Clique no botão de Criar Novo Email e então selecione Envio Padrão.
  3. Parte importantíssima do processo: Selecione o EDITOR DE CÓDIGO.

  1. Defina um nome para o seu email, isso será apenas para fins de teste, já que você não vai enviar esta campanha. Quando terminar, recomendamos deletar o email ou deixar como está porque o código pode mudar.
  2. Não é necessário completar toda a checklist do email, vá diretamente para a opção de Design do Email.

  1. Substitua o texto pré-existente do editor na esquerda com o Código HTML que você copiou anteriormente do Pequeno Formulário Incorporado. Você então verá seu formulário à direita.

Não se preocupe com o rodapé neste momento, pois ele não será exibido quando você copiar seu código.

  1. Agora, use seu teclado para pesquisar os campos. Se você utiliza Mac, use Cmd + f, se usa Windows, utilize Ctrl + F.

Este é um exemplo do que exatamente estamos procurando:

  1. Digite na barra de pesquisa: fieldset OU o nome do campo (ex. Nome). Se você pesquisar por fieldset, você encontrará vários resultados, mas nós estamos procurando pelo seguinte texto:

<fieldset class=”formbox-field 

O primeiro seguido de: class=  

Você irá reconhecê-lo facilmente, já que ele contém o nome do campo. Observe a imagem acima, o nome do campo está destacado em azul.

  1. Agora podemos editar. ANTES da tag <fieldset, adicione o seguinte código (você pode copiar e colar):

<table><tr><td>

  1. Ao concluir, feche a tag adicionando o seguinte código no final:

</td>

Identifique onde está o final do campo ao visualizar esta tag: </fieldset>.

  1. Vá para o próximo campo e adicione antes da tag:

 <td> 

  1. Se você tiver mais um campo (campo de sobrenome), adicione o <td> no início e feche com </td>
  2. No final do seu último campo, feche com as tags:

 </td></tr></table>

  1. Você verá que seu formulário agora estará na horizontal, e então, por último, delete a largura (width).
  2. Vamos fechar a barra de pesquisa novamente e pesquisar pela seguinte largura:

width: 320px

Ao encontrar, DELETE esta parte do código, mas não apague nada além disso.

É assim que o código ficará no final:

Observe que destacamos em azul as tags adicionadas. Além disso, o atributo de largura foi removido e você já poderá visualizar o formulário na horizontal.

  1. E o formulário está pronto! Agora, copie todo o código e cole no seu site.

Se você for uma pessoa mais visual, siga as etapas descritas neste vídeo:

 

 

Voltar ao topo

Formulários Pop-up

Esses formulários irão aparecer assim que um usuário visitar sua página. A página ficará acinzentada, dando destaque para a janela do formulário.

Como criar um formulário deste estilo:

  1. Entre na sua conta Benchmark e, na tela principal, selecione Contatos.
  2. Depois, selecione Formulários de Inscrição no menu.
  3. No lado direito da página, clique no botão Criar Formulário de Inscrição.
  4. Selecione Formulário Pop-up e clique em Próximo.
  5. Dê um nome ao seu formulário e selecione a lista de contatos.
  6. Clique em Salvar & Próximo.
  7. Crie e edite seu formulário de inscrição:
      • Você pode adicionar a mensagem de confirmação de inscrição clicando no botão de Configurações de Opt-In na parte superior da página.
      • Defina as configurações do seu pop-up clicando em Configurações Gerais, editando as opções disponíveis.
  8. When done click on Save & Publish.

Ao concluir as modificações, clique em Salvar & Publicar.

Caso tenha mais dúvidas, por favor entre em contato com nossa equipe de suporte via Email, LiveChat ou telefone (opção disponível para clientes Premium).

Observação:

  • Por padrão, o Formulário Pop-up tem 400px de largura, com preenchimento de 40px à esquerda e à direita. A área máxima para a imagem é de 320px. No entanto, se a imagem ocupar toda a largura, você poderá alterá-la, se necessário.

O que você pode personalizar

Neste formulário, é possível personalizar mais do que apenas o formulário, por exemplo, também é possível editar a mensagem de sucesso. Lembre-se, este é um formulário que você define para aparecer numa pequena janela quando um novo visitante acessa o seu site. Embora você possa adicionar vários campos, sugerimos manter o formulário pop-up curto, assim você tem mais chances de conquistar inscritos.

  • Você pode escolher a posição em que o pop-up será exibido. A opção mais comum é utilizar o pop-up centralizado.
  • Você pode definir uma nova largura.
  • Você também pode adicionar um efeito! Seu formulário pode surgir da esquerda, de cima, da direita, de baixo, expandir ao abrir ou esmaecer.
  • O tempo de espera significa que é possível escolher um atraso para que o formulário seja exibido, que pode ser de 0 a 60 segundos.
  • Semelhante aos outros formulários, você também pode personalizar cor, borda, raios do cantos e, para esse tipo de formulário, pode adicionar uma sombra, escolher a opacidade e o tamanho dela.
  • Os visitantes poderão fechar a janela pop-up, caso não estiverem interessados. Personalize a posição do ícone de fechar, a cor, o tipo do ícone, fundo, borda, etc.
  • Por padrão, a cor da sobreposição é preta e com 70% de opacidade. Esta sobreposição será o plano de fundo do seu formulário, quando ele for exibido. Você pode personalizar a cor, a opacidade ou mesmo desativá-la, caso queira. Recomendamos que você mantenha a sobreposição para dar ao formulário um impacto visual maior.
  • Clique no formulário para adicionar imagens, texto, espaçadores, personalizar o cabeçalho, os campos e o botão de inscrição.
  • No menu superior, à direita (Inscreva-se), clique na opção Sucesso para personalizar a mensagem. Você pode alterar a fonte, a cor, o texto e o fundo.

Precisando de inspiração? Veja alguns formulários de inscrição que foram criados na Benchmark.

Voltar ao topo

 

O Formulário Pop-up aparece mais de uma vez para usuários já cadastrados?

Por padrão, nossos formulários pop-up são definidos para aparecer apenas quando um visitante ainda não se inscreveu na lista. Depois que ele se inscrever, o formulário pop-up não será exibido novamente. No entanto, se o visitante que retornar limpa o cache do navegador, usa uma janela anônima ou outro navegador, o formulário pop-up será exibido novamente.

Como definir um formulário pop-up para aparecer apenas uma vez?

  1. Na etapa de Design do seu formulário de inscrição, clique em Configurações Gerais.
  2. Em seguida, clique na opção Fechar.
  3. Depois, selecione a opção “Mostrar o pop-up apenas uma vez para os visitantes de seu site”.

Para finalizar, clique em Salvar & Publicar.

Se o formulário de inscrição for utilizado em várias páginas, a regra de aparecer apenas uma vez ainda se aplicará.

 

Voltar ao topo

 

Formulário Clássico

Importante:

  • O Formulário Clássico é um formulário antigo, semelhante aos Formulários Incorporados, e que tornou-se obsoleto.
  • Atualmente, o Formulário Incorporado substitui o formulário de inscrição clássico.
  • Você pode duplicar os formulários de inscrição clássicos existentes, mas não poderá criar novos.
  • O formulário de inscrição clássico está disponível apenas para usuários que ainda utilizam a interface antiga.

Voltar ao topo

 

Como criar um Formulário de Inscrição compatível com a GDPR

Adicionar uma caixa de seleção para estar em conformidade com a GDPR é um processo de duas etapas. Veja abaixo:

  • Editar um campo extra em uma lista de contatos.
  • Adicionar a caixa de seleção no formulário de inscrição.

Campo Extra na lista de contatos

  1. Crie uma lista que deve ser vinculada ao Formulário de Inscrição.
  2. Depois de abrir a lista, clique em Editar.
  3. Você verá todos os campos da lista. Vá até os campos Extra e selecione um deles para renomear. Você pode intitular como Política de Privacidade, por exemplo.
  4. Altere o tipo de campo para Verdadeiro / Falso. Desta forma, fica registrado o “sim” ou o “não” como resposta fornecida da aceitação dos termos.

 

Após a edição do tipo do campo, precisamos criar o formulário de inscrição compatível com a GDPR.

Adicionando a caixa de seleção no Formulário de Inscrição

Para isso, você pode usar o Formulário Incorporado ou o Formulário Pop-up.

  1. Crie um formulário de inscrição ou utilize um já existente.
  2. Em seguida, selecione a lista que você criou acima com o campo editado. Na segunda etapa do processo de criação do formulário de inscrição, adicione o campo que editamos na etapa anterior.
  3. Passe o mouse entre o campo de Nome e Endereço de Email e clique nos 3 pontos para adicionar o campo.
  4. Em seguida, clique em Selecione Campos e habilite o campo extra que você editou.
  5. Assim que habilitar o campo e clicar na seta para voltar, você verá o campo escolhido.
  6. Clique no campo.
  7. Você pode dar um nome ao seu campo, mas caso já tenha alterado o nome do campo na lista, esse passo é opcional.
  8. Altere o Tipo para Verificação.
  9. Marque este campo como Obrigatório.
  10. No campo de resposta, adicione o seguinte trecho de código. <a target=”blank” href=”https://www.seu site.com”> <u> Política de Privacidade </u> </a> Obs.: Substitua https://www.seusite.com pela página que contenha a Política de Privacidade do seu site ou negócio.

Continue editando seu formulário e clique na opção Salvar & Publicar quando tiver terminado.

Importante

  • O link href mencionado no ponto 10 deve ser o link de Política de Privacidade do seu site.
  • A caixa de seleção acima não pode ser criada usando o Pequeno Formulário Incorporado, pois ela não é suportada neste formato.

Você também pode assistir o vídeo abaixo para saber mais:

  • Formulário de Inscrição Incorporado Completo (somente na nova interface)

 

Voltar ao topo

Observação

Se você estiver familiarizado com CSS, também pode adicionar seu próprio código e dar um toque diferente aos seus formulários.

Caso tenha quaisquer dúvidas relativas a este assunto, entre em contato com um de nossos especialistas através do Chat ou do email suporte@benchmarkemail.com (atendimento telefônico disponível apenas para Clientes Premium, na guia “Ajuda” de sua conta).


Sua Dúvida Foi Respondida?
Você já votou!

Não está encontrando a resposta para sua dúvida?

Abrir um Chamado