Está procurando uma maneira de tornar mais positiva a experiência dos visitantes do site que entram em contato com você por meio de um formulário de várias etapas?
Ao dividir o formulário em diferentes seções, você pode combater a fadiga do formulário e aumentar o envolvimento do usuário e a geração de leads no seu site.
Neste guia, vamos orientá-lo sobre os princípios básicos da configuração de um formulário de várias etapas no WordPress com o WPForms por meio de dois métodos diferentes.
Como criar um formulário de várias etapas no WordPress
Criar um formulário de várias etapas no WordPress usando o WPForms é incrivelmente fácil. Basta seguir as etapas abaixo:
Neste artigo
Etapa 1: Instale um plug-in de criação de formulários em várias etapas
Se você estiver procurando um plug-in de criação de formulários que permita criar formulários de várias etapas, calculadoras e outros tipos de formulários, não precisa procurar mais, pois o WPForms é o melhor. Ele oferece vários recursos que tornam a criação de um formulário personalizado incrivelmente fácil.
Para este tutorial, recomendamos que você se inscreva no WPForms Pro, pois ele tem muitos recursos, como quebras de página, o Lead Forms Addon, lógica condicional e modelos personalizáveis que facilitam muito a criação de um formulário de várias etapas.
Depois de adquirir a licença do WPForms Pro, tudo o que você precisa fazer é ativar e instalar o plug-in em seu site. Para obter instruções passo a passo sobre como fazer isso, consulte este guia sobre como instalar um plug-in do WordPress.
Etapa 2: Crie seu formulário e adicione campos relevantes
Agora, vamos criar seu formulário de várias etapas no WordPress. Em seu painel, basta navegar até WPForms e clicar no botão Add New (Adicionar novo ).
Na próxima página, dê um nome ao seu formulário. Para fins deste tutorial, chamaremos o nosso de "Formulário em várias etapas do WordPress".
Depois disso, você pode optar por começar a criar o formulário do zero, clicando no botão Create Blank Form (Criar formulário em branco), ou pode adicionar campos a um modelo existente.
Para economizar tempo e prosseguir com a adição de campos relevantes ao nosso formulário, selecionaremos o Formulário de contato simples e, em seguida, clicaremos no botão Usar modelo.
Depois de clicar no botão Use Template (Usar modelo), você será redirecionado para o Form Builder (Criador de formulários). No lado esquerdo, você pode ver todos os campos disponíveis.
Enquanto isso, no lado direito da tela, você pode ver uma visualização editável do formulário, onde é possível arrastar e soltar outros campos a seu gosto.
Com o modelo de formulário SimpleContact, você já terá os campos de formulário Nome, E-mail e Comentário ou Mensagem.
Clique em qualquer um dos campos do formulário para fazer alterações ou adicionar novos campos para personalizar o formulário. Por exemplo, adicionamos campos para que os usuários forneçam informações sobre:
- Nome da empresa - Usando o campo Texto de linha única.
- Título do cargo - Novamente, usando o campo Texto de linha única.
- Site - Usando o campo Site/URL da seção Fancy Fields.
- Setor - Usando um campo de caixa de seleção e adicionando opções como Tecnologia da informação, Manufatura, Varejo e Saúde.
- País/Região - Usando um campo suspenso e adicionando opções como Estados Unidos, Canadá, Austrália, Reino Unido e Nova Zelândia.
- Como você ficou sabendo sobre nós? - Mais uma vez, use o campo suspenso e adicione opções como Google, Facebook, LinkedIn, etc.
Adicionamos esses campos para aprimorar ainda mais o modelo de formulário e torná-lo relevante para o nosso caso de uso. Agora, vamos dar uma olhada em como dividir seu formulário em várias partes.
Etapa 3: Divida seu formulário em várias partes
Você gostará de saber que dividir seu formulário em várias partes é muito fácil com o WPForms, e você não tem apenas um método para fazer isso!
Dependendo de suas necessidades, você pode usar o campo Page Break para dividir seu formulário ou usar o Lead Forms Addon. Mostraremos a você as etapas para ambos!
Método 1: Adicionar o campo de quebra de página para dividir o formulário
Para começar a dividir seu formulário em várias partes, arraste e solte o campo Quebra de página, do painel esquerdo para o painel direito.
Lembre-se de que você precisa inserir o campo Page Break no local exato em que deseja que o formulário seja dividido.
Se você quiser dividir o formulário novamente, repita as mesmas etapas. O WPForms permitirá que você crie quantas páginas de formulário forem necessárias.
Você pode criar formulários de duas etapas ou ir tão longe quanto desejar, mas lembre-se de manter as coisas simples, pois não quer sobrecarregar seus usuários.
Quando terminar, você poderá personalizar a barra de progresso de várias páginas para aumentar a facilidade de uso do formulário.
Personalizar a barra de progresso do formulário de várias páginas
Usando uma barra de progresso, você pode informar aos usuários sobre as diferentes seções do formulário, para que eles saibam quanto falta para preencher antes de clicar em Enviar.
O WPForms facilita muito as coisas para você com a introdução de três barras indicadoras de estilo breadcrumb diferentes para formulários de várias etapas:
- Barra de progresso: Essa opção permite que o usuário veja o progresso do formulário à medida que o preenche para mantê-lo informado.
- Círculos: Essa opção permite que seu formulário de várias etapas exiba um círculo e o título da página em cada página.
- Conector: Essa opção exibe os títulos das páginas e uma barra de conexão para cada seção do seu formulário de várias etapas.
Clique na seção First Page break (Quebra da primeira página ) para personalizar a barra de progresso e o título da página da primeira página do formulário de várias etapas. Nesse local, você pode:
- Selecione o tipo de indicador de progresso desejado.
- Modifique a cor do indicador de página de acordo com sua preferência.
- Personalize o título da página para ajudar os usuários a entender em que seção do formulário eles estão (se tiver selecionado Círculos ou Conectores).
Personalizar o título da próxima página e o texto do botão
Você alterou o Page Title da primeira seção do formulário, mas e as outras seções do formulário?
Assim como na primeira página, é possível alterar o título da página da próxima seção clicando no campo Quebra de página relevante e até mesmo personalizar o rótulo Next Label.
Além disso, você pode ativar a opção Display Previous (Exibir anterior ) para mostrar um botão de página anterior aos visitantes do site e até mesmo personalizar o rótulo de anterior conforme sua preferência.
Dessa forma, se necessário, os clientes podem voltar à página anterior do formulário, o que aumenta ainda mais a facilidade de uso do formulário.
Método 2: Use o complemento Lead Forms para dividir o formulário
O campo Quebra de página funciona muito bem para dividir o formulário em várias seções, mas se você estiver procurando uma alternativa, poderá usar o Lead Forms Addon.
Além disso, gerar leads é ótimo para gerenciar sua pequena empresa no WordPress, o que também é totalmente possível com o WPForms.
A instalação do Lead Forms Addon é muito simples. No painel do WordPress, vá para WPForms e clique em Addons.
Depois disso, procure por "Lead Forms" na seção Search Addons. Em seguida, clique em Install Addon (Instalar complemento), seguido do botão Activate (Ativar ).
Ativar o modo de formulário de lead no Form Builder
Depois que o complemento Lead Forms estiver instalado e ativado, retorne ao construtor de formulários onde você está criando o formulário.
A partir daí, clique na guia Settings (Configurações ) e selecione a opção Lead Forms (Formulários de leads). Agora, tudo o que você precisa fazer é ativar a opção Enable Lead Form Mode (Ativar modo de formulário de lead ).
Isso fará com que apareça uma janela pop-up informando que o Lead Forms Addon reestruturará seu formulário. Clique no botão Enable Lead Forms (Ativar formulários de lead ).
Seus campos serão transformados automaticamente em um formulário de lead. A menos que você tenha um grande número de campos, isso normalmente leva alguns segundos.
Seu formulário agora será automaticamente dividido em várias seções. Sinta-se à vontade para adicionar, modificar e organizar os campos de acordo com sua preferência.
Personalizar as configurações de estilo do formulário de lead
Um dos melhores aspectos do Lead Forms Addon é que ele permite que você personalize a aparência do formulário no front-end.
A página de configurações do Lead Forms contém todas as opções de personalização. Veremos a seguir as opções de personalização disponíveis.
- Título do formulário de lead: Você pode dar um título ao seu formulário de lead inserindo-o no campo Título do formulário de lead. Quando os usuários preencherem o formulário, o título aparecerá no front end.
- Accent Color: essa opção permite que você altere a cor dos botões, da barra de progresso e dos ícones por meio de uma ferramenta interativa de seleção de cores.
- Animação de rolagem: Com essa opção ativada, o WPForms navegará o usuário até o topo da página, ao clicar no botão Next (Próximo) do formulário.
Seu formulário de lead pode ser ainda mais personalizado com a ajuda de configurações adicionais. Você precisará ativar as Advanced Style Settings para acessar essas opções.
Há também uma opção de Contêiner de formulário, que pode ser ativada para incluir o Formulário de lead em um contêiner, fazendo com que ele se destaque do restante dos elementos da página.
Depois de personalizar o formulário de várias etapas para incluir todos os recursos desejados, não se esqueça de pressionar o botão Salvar.
Você também pode usar um formulário de várias etapas para capturar novos leads e aumentar sua lista de e-mails. Confira este guia sobre como criar uma página de ímã de leads com o WPForms!
Etapa 4: Personalizar notificações e confirmações
A configuração das notificações garante que você esteja sempre atualizado sobre as novas entradas de formulário. No construtor de formulários, vá para Settings (Configurações) e, em seguida, Notifications (Notificações).
Você pode editar as configurações de notificação padrão, como a linha de assunto, ou alterar os e-mails dos destinatários, conforme necessário, a partir daqui.
Depois disso, basta navegar até Confirmations (Confirmações ) no menu Settings (Configurações ) para configurar respostas para envios de formulários bem-sucedidos.
Agora, selecione o tipo de confirmação (mensagem, exibição de página ou redirecionamento) que funciona melhor para o seu site e configure as opções.
Lembre-se de salvar seu formulário novamente para evitar a perda de alterações e garantir que suas configurações estejam atualizadas.
Etapa 5: Publique seu formulário WordPress em várias etapas
Excelente trabalho! Você criou com sucesso um formulário de várias etapas no WordPress. Agora é hora de colocá-lo no ar e ver os envios de formulários chegando!
O processo é incrivelmente simples e você nem precisa sair do construtor de formulários. Basta clicar no botão Incorporar no canto superior direito.
Você pode optar por publicar o formulário em uma página existente ou criar uma nova página, após o que será redirecionado para o editor de blocos do WordPress.
O formulário já estará incorporado. Tudo o que você precisa fazer agora é clicar no botão Publicar e seu formulário WordPress de várias etapas estará ativo!
Se estiver usando um construtor de páginas como o Divi, você também pode consultar este guia para obter etapas sobre como criar um formulário de contato Divi.
Mais perguntas sobre formulários de várias etapas
Os formulários em várias etapas do WordPress são um tópico de interesse popular entre nossos leitores. Aqui estão as respostas para algumas perguntas sobre eles.
O que é um formulário de várias etapas?
Um formulário de várias etapas divide um formulário em várias etapas ou páginas, aprimorando a experiência do usuário ao dividir formulários mais longos em seções gerenciáveis. Isso é ideal para formulários complexos, como aplicativos, pesquisas ou registros. O WPForms simplifica a criação de formulários de várias etapas com seu campo Quebra de página, permitindo uma navegação fácil para os usuários.
Um formulário de várias etapas deixará meu site mais lento?
Não, um formulário de várias etapas não deixará seu site mais lento. O WPForms, especialmente com seu Lead Forms Addon, otimiza esses formulários para velocidade e desempenho, garantindo que eles carreguem rapidamente sem afetar a velocidade geral do seu site.
Quando devo usar um formulário de várias etapas?
Use um formulário de várias etapas quando tiver formulários longos ou detalhados. Eles são perfeitos para registros, pesquisas ou aplicativos em que você precisa coletar muitas informações, mas quer evitar sobrecarregar o usuário na página de destino. O WPForms permite a criação eficiente de formulários em várias etapas, aumentando o envolvimento do usuário.
Quais tipos de formulários convertem melhor no layout de várias etapas?
Os formulários que exigem informações detalhadas, como candidaturas a empregos, pesquisas complexas e registros longos, convertem melhor com um layout de várias etapas. Esse formato, facilmente criado com o WPForms, ajuda a manter os usuários envolvidos e reduz a sensação de sobrecarga de um formulário longo, aumentando as taxas de conversão.
A seguir, saiba como criar um formulário de calculadora no WordPress
Deseja aprender a criar um formulário de calculadora no WordPress para aumentar o envolvimento do usuário em seu site? Você está com sorte! Criar um formulário de calculadora personalizado é rápido e fácil, graças ao WPForms e ao seu complemento Calculations Addon.
Se estiver se perguntando como incentivar os usuários a preencher um formulário que exige o e-mail deles para fazer download de um arquivo, isso também é possível. Confira este guia sobre Como exigir um endereço de e-mail para fazer download de um arquivo.
Corrija seus e-mails do WordPress agora
Pronto para corrigir seus e-mails? Comece hoje mesmo a usar o melhor plugin SMTP para WordPress. Se você não tiver tempo para corrigir seus e-mails, poderá obter assistência completa da White Glove Setup como uma compra extra, e há uma garantia de reembolso de 14 dias para todos os planos pagos.
Se este artigo o ajudou, siga-nos no Facebook e no Twitter para obter mais dicas e tutoriais sobre o WordPress.
