Como Adicionar um Formulário a uma Página
Use o elemento Formulário quando quiser capturar leads diretamente em uma landing page, página de vendas, inscrição para webinar ou seção de follow-up de quiz. Este guia mostra como adicionar o formulário, configurar as principais opções que afetam os envios e verificar se os leads chegam corretamente.
Antes de Começar
Certifique-se de ter:
- Uma página aberta no Page Builder.
- Uma lista clara dos campos que você precisa (por exemplo, nome, e-mail, telefone).
- Acesso a Leads para revisar os envios após os testes.
- Credenciais de autoresponder, webhook ou Google Sheets prontas se você planeja enviar dados para fora do Atomicat.
Passo 1: Adicionar o Elemento Formulário
- Abra Pages e clique em Edit na página desejada.
- No Page Builder, abra o painel de elementos.
- Arraste Formulário para o container ou seção correta (geralmente perto do seu CTA ou bloco de oferta).
- Clique no formulário no canvas para abrir o painel de configurações à direita.
Coloque o formulário onde os visitantes já esperam agir. Formulários abaixo da dobra no mobile frequentemente precisam de listas de campos mais curtas para converter bem.
Passo 2: Nomear o Formulário
Nas configurações do formulário, defina um nome do formulário que sua equipe possa reconhecer depois em Leads e nas integrações.
Exemplos:
Inscrição webinar – oferta marçoCaptura de leads VSLFollow-up resultado quiz
Nomes claros facilitam muito a filtragem e a resolução de problemas de webhook quando você executa várias campanhas.
Passo 3: Configurar os Campos do Formulário
Cada campo controla quais dados você coleta e se o visitante pode enviar sem preenchê-lo.
| Configuração | O que faz |
|---|---|
| Tipo de campo | Escolhe o tipo de entrada: nome, e-mail, telefone, texto ou outros tipos suportados. |
| Rótulo | A pergunta ou nome do campo visível (por exemplo, E-mail). |
| Placeholder | Texto de dica dentro do campo antes do visitante digitar. |
| Valor padrão | Pré-preenche o campo quando a página carrega. |
| Obrigatório | Bloqueia o envio até que o campo seja preenchido. |
| Visibilidade | Mostra ou oculta o campo quando a lógica condicional está disponível. |
| Visibilidade do rótulo | Mostra ou oculta o rótulo mantendo o campo de entrada visível. |
| Validação | Aplica regras como formato válido de e-mail ou telefone. |
| ID do componente | ID interno usado para integrações, rastreamento ou suporte. |
Campos de telefone
Quando você adiciona um campo de telefone, também pode ver:
- Seletor de país — Permite que os visitantes escolham um código de país.
- Detectar país automaticamente — Identifica o país do visitante quando suportado.
- Países padrão / permitidos / preferidos — Controla quais países aparecem no seletor.
Use validação de telefone quando sua equipe de vendas precisa de um número em formato discável.
Ordem dos campos
Reordene os campos arrastando-os na lista de campos. Coloque os campos de maior atrito por último e mantenha os campos obrigatórios no mínimo.
Dica: Formulários curtos geralmente convertem melhor. Adicione apenas os campos que seu processo de follow-up realmente utiliza.
Passo 4: Configurar o Botão de Envio
| Configuração | O que faz |
|---|---|
| Texto do botão | O rótulo do CTA que os visitantes clicam para enviar (por exemplo, Obter acesso, Inscrever-se, Enviar). |
| Comportamento de destino | Controla o que acontece ao clicar—normalmente o envio do formulário na mesma página. |
| Comportamento de sucesso | O que os visitantes veem após um envio bem-sucedido: mensagem, redirecionamento ou próximo passo quando configurado. |
| Comportamento de erro | Feedback quando a validação falha ou ocorrem erros de envio. |
Use um texto de botão que explique o resultado. Inscrever-se no webinar converte melhor do que um genérico Enviar.
Passo 5: Conectar um Autoresponder (Opcional)
Use Autoresponder quando os envios também devem ir para uma ferramenta de e-mail marketing ou CRM.
| Configuração | O que faz |
|---|---|
| Autoresponder | Seleciona o provedor (apenas provedores conectados aparecem). |
| Conta | Escolhe qual conta conectada usar. |
| Tipo | Tipo de destino como lista, formulário ou contato—depende do provedor. |
| Lista ou formulário | A lista ou formulário externo que recebe o lead. |
| Tags | Tags aplicadas ao contato quando o provedor as suporta. |
| Mapeamento de campos | Mapeia os campos do Atomicat para os campos do provedor. O mapeamento de e-mail é obrigatório para muitos destinos de lista. |
| Leads abandonados | Envia dados parciais quando um visitante começa mas não termina o formulário. |
Após mapear os campos, salve a página e envie um envio de teste pela URL publicada. Confirme que o contato aparece na ferramenta externa com os dados corretos.
Passo 6: Conectar um Webhook (Opcional)
Webhooks enviam dados de envio para uma URL externa em tempo real.
| Configuração | O que faz |
|---|---|
| Nome do webhook | Rótulo interno para sua equipe. |
| URL do webhook | Endpoint que recebe o payload. |
| Descrição | Nota opcional sobre a integração. |
| Enviar leads abandonados | Envia envios incompletos quando habilitado. |
| Histórico do webhook | Mostra status de entrega, resposta, tentativas e estado de retry. |
| Reenviar webhook | Reenvia um payload anterior quando suportado. |
Consulte Conectar um formulário a um webhook e Google Sheets para guias de configuração estendidos.
Passo 7: Ajustar o Layout (Principais Opções de Estilo)
Você não precisa estilizar cada cor para lançar. Foque nestas configurações de layout primeiro:
| Área | O que verificar |
|---|---|
| Layout dos campos | Espaçamento entre campos, largura dos campos e comportamento de colunas no desktop vs mobile. |
| Largura do container do formulário | Se o formulário ocupa a largura total ou uma coluna mais estreita. |
| Altura e padding dos inputs | Legibilidade no mobile—os campos devem ser fáceis de tocar. |
| Largura do botão | Botões de largura total geralmente performam melhor em landing pages mobile. |
Visualize no mobile após alterar o layout dos campos. Campos apertados são uma razão comum de abandono de formulário.
Passo 8: Salvar, Publicar e Testar
- Clique em Save no builder.
- Publique a página no seu site ou domínio. Consulte Publicar uma página.
- Abra a URL ao vivo em uma janela anônima.
- Envie o formulário com dados de teste realistas.
- Abra Leads e confirme que o envio aparece. Consulte Leads de formulário.
Checklist de testes
- Deixe campos obrigatórios vazios e confirme que as mensagens de validação aparecem.
- Teste formatos inválidos de e-mail ou telefone se a validação estiver habilitada.
- Confirme que a mensagem de sucesso ou redirecionamento funciona.
- Verifique a entrega do autoresponder ou webhook se conectados.
- Teste em um dispositivo mobile.
Solução de Problemas
| Problema | O que verificar |
|---|---|
| Formulário não envia | Campos obrigatórios, regras de validação e se a página foi salva. |
| Lead ausente no Atomicat | A página foi publicada; você testou a URL ao vivo correta. |
| Autoresponder não recebeu o lead | Provedor, conta, lista, tags e especialmente o mapeamento de campos. |
| Webhook falhou | URL correta, endpoint ativo, verifique o histórico do webhook. |
| Layout quebrado no mobile | Largura dos campos, espaçamentos e largura do botão no breakpoint mobile. |
Resultado
Após concluir este fluxo de trabalho, sua página captura informações dos visitantes pelo elemento Formulário. Os envios aparecem em Leads e podem fluir para autoresponders, webhooks ou Google Sheets quando configurados.
Documentação Relacionada
- Referência do elemento Formulário
- Leads de formulário
- Webhooks de formulário
- Visão geral de Leads
- Publicar uma página
FAQ
Quantos campos devo adicionar a um formulário de landing page?
Adicione apenas o que seu follow-up precisa—geralmente nome e e-mail, às vezes telefone ou uma pergunta qualificadora. Formulários mais curtos geralmente convertem melhor, especialmente no mobile.
Para onde vão os envios do formulário?
Envios publicados aparecem em Leads quando o formulário está configurado corretamente. Você também pode enviar dados para autoresponders, webhooks ou Google Sheets quando essas conexões estiverem configuradas.
Preciso publicar antes de testar?
Sim. Teste na URL ao vivo publicada em uma janela anônima. Salvamentos de rascunho no builder não enviam leads reais para integrações de produção.
Por que o mapeamento de campos do autoresponder é importante?
Ferramentas externas precisam que os campos do Atomicat sejam mapeados para os campos de destino. Se o e-mail não estiver mapeado corretamente, os contatos podem ser criados com dados ausentes ou incorretos.
Posso capturar dados abandonados ou parciais do formulário?
Sim, quando leads abandonados está habilitado nas configurações de autoresponder ou webhook. Use isso apenas se seu processo de follow-up foi projetado para lidar com envios incompletos.