Como usar o campo repetidor no WPForms [Rápido e fácil]

Está se perguntando como inserir um campo repetidor em seu formulário para capturar mais dados para cada envio?

Os campos repetidores em formulários permitem que os usuários insiram vários conjuntos de dados semelhantes, tornando os formulários mais intuitivos e fáceis de usar.

Neste artigo, mostrarei a maneira mais fácil de projetar um campo repetidor para WPForms para aumentar a funcionalidade do seu site e a experiência do usuário.

Crie formulários com campos repetíveis 🔁.

Como criar um formulário com um campo repetidor no WordPress

Siga estas etapas para criar um formulário com campos repetidos para seu site WordPress:

Etapa 1: Instalar o WPForms Pro

O WPForms oferece uma solução super intuitiva e sem esforço para criar campos repetidores. Para começar, você precisará de uma licença do WPForms Pro.

Depois de obter o WPForms Pro, vá em frente e instale o plug-in em seu site. Se não estiver familiarizado com a instalação de plug-ins, consulte este guia sobre a instalação do WPForms.

Depois que o WPForms Pro estiver instalado e pronto, você poderá criar formulários com campos repetidos e também acessar vários recursos e complementos impactantes, como Geolocalização, Planilhas Google e muito mais.

Pronto? Passe para a próxima etapa para começar a criar um formulário com campos repetidores.

Faça o upgrade para o WPForms Pro agora 🐻

Etapa 2: Criar um novo formulário

No painel do WordPress, passe o cursor do mouse sobre o menu da barra lateral do WPForms e clique em Add New (Adicionar novo).

Agora você precisará dar um nome ao seu formulário e escolher um modelo ou criar o formulário do zero. O WPForms vem com mais de 2.000 modelos de formulários, permitindo que você crie qualquer tipo de formulário no WordPress.

Mas, para ilustrar o trabalho com campos Repeater no WPForms, começarei com o formulário em branco e o construirei do zero.

Em apenas alguns segundos, a tela do construtor de formulários será carregada, onde você poderá criar seu formulário personalizado usando controles de arrastar e soltar. Para simplificar, vamos criar um formulário com apenas três campos: Nome, E-mail e Telefone.

Mas se quisermos que esses campos sejam repetíveis, a primeira coisa que precisamos fazer é inserir o campo Repetidor, arrastando-o do painel da esquerda para a direita.

Depois de inserir o campo Repetidor, clique nele para abrir as Opções de campo relacionadas a ele, à esquerda.

Vou deixar a configuração Display como padrão porque ela funciona muito bem para o meu cenário.

Mas, para minha configuração, precisarei de um layout de três colunas. Você pode selecionar o layout que melhor lhe convier, bastando escolher uma das 9 predefinições de layout disponíveis para o Repetidor.

Ao selecionar o layout, você verá a visualização à direita mudar instantaneamente com as zonas suspensas aparecendo nas colunas. Essas são as áreas em que você pode inserir quaisquer outros campos que queira tornar repetíveis.

Mas, primeiro, vamos renomear o campo Repetidor. Você pode fazer isso editando o rótulo nas Opções de campo.

Em seguida, é hora de inserir os campos dentro das zonas suspensas do campo Repetidor. Depois de arrastar os campos Name (Nome), Email (E-mail) e Phone (Telefone), um a um, para as zonas suspensas do campo Repetidor, o formulário fica assim:

Você deve ter notado que algo parece um pouco estranho aqui. E você está certo. O campo Name está dividido em duas linhas, o que não parece bom no contexto visual atual.

Mas essa é uma correção fácil. Na próxima etapa, personalizarei algumas das configurações e a aparência do

Etapa 3: Personalizar o campo do repetidor

Como quero que todos os campos da minha seção repetidora apareçam em uma única linha, alterarei o formato do campo Nome para que ele se alinhe com os outros campos.

Você pode fazer isso clicando no campo Name (Nome) para abrir suas Field Options (Opções de campo), onde encontrará o menu suspenso Format (Formato) no painel esquerdo. Clique na lista suspensa Format e selecione Simple.

Você notará que o campo Nome foi reduzido a um único campo para que fique alinhado com os outros campos.

Neste ponto, o campo repetidor está pronto. Mas antes de prosseguirmos com a publicação do formulário, vamos examinar algumas configurações adicionais do campo Repetidor que talvez você queira verificar.

(Opcional) Configurações adicionais de campo do repetidor

Clique no campo Repetidor para abrir novamente as Opções de campo.

Se você rolar para baixo no painel à esquerda, verá opções para definir as quantidades mínima e máxima de tempo que o campo repetidor pode ser duplicado pelo visitante. Basta inserir os números para definir seus limites de forma conveniente.

Em seguida, vamos rolar novamente até a parte superior do painel Field Options (Opções de campo). Dessa vez, clique em Blocks (Blocos ) nas opções de exibição.

Ao usar o campo Repetidor no modo Blocos, você obtém configurações adicionais. Por exemplo, você também pode personalizar os botões "adicionar" e "remover" que os visitantes usarão para duplicar o campo ou remover uma cópia dele.

Você pode escolher entre diferentes tipos de botões e editar os rótulos dos botões.

Além disso, você também tem a liberdade de adicionar um grupo de campos em várias linhas ao usar o modo Blocks. Com o modo Rows, você só está limitado a adicionar campos em uma única linha.

As linhas funcionam muito bem para requisitos simples, como o formulário que estou criando neste tutorial. No entanto, a opção Blocks oferece mais controle para casos de uso mais avançados em que é necessário tornar um grupo maior de campos repetíveis.

Quando terminar de fazer as alterações, não se esqueça de pressionar o botão Save (Salvar ).

Excelente trabalho! Você está quase pronto para publicar o formulário.

Etapa 4: publique seu formulário com campos repetidores

O WPForms facilita a incorporação de seus formulários e o início da coleta de envios. Você pode iniciar o processo de incorporação clicando no botão Incorporar na parte superior do construtor de formulários.

Depois disso, será exibido um modal que permitirá que você selecione o método de incorporação. Vamos selecionar Create New Page.

Em seguida, digite um nome para o formulário e clique em Let's Go.

Depois disso, o editor de blocos do WordPress será aberto. O formulário que você acabou de criar com o campo repetidor já deve estar incorporado aqui.

Agora seria o momento perfeito para estilizar seu formulário usando o editor de blocos. Em particular, você pode tentar adicionar um tema ao formulário para dar a ele uma aparência moderna.

Você pode selecionar um tema clicando em qualquer lugar do formulário para abrir as opções de bloco no painel do lado direito. Role para baixo até a seção Temas e escolha um.

Agora que seu formulário tem uma aparência agradável e impressionante, publique-o quando estiver pronto. Basta pressionar o botão Publicar na parte superior.

Quando você terminar de publicar o formulário, a única coisa que resta a fazer é testar o formulário incorporado para garantir que ele funcione conforme o esperado no frontend.

Esta é uma demonstração rápida em que testo o formulário e verifico se está tudo certo com a funcionalidade do campo Repetidor, enviando uma entrada de teste:

E tudo está funcionando exatamente como esperado! 🙂

Então é isso. Com o campo repetidor, agora você pode criar facilmente formulários dinâmicos que podem ser controlados pelo usuário. Essa é a chave para aumentar o envolvimento do usuário e a satisfação necessária para coletar envios de formulários em escala.

Criar um formulário com um campo repetidor

Confira também este guia para saber se você deve ou não usar o campo WPForms Repeater ou o campo Layout com lógica condicional para otimizar ainda mais seu formulário.

Mais perguntas sobre o campo repetidor do WPForms

A criação de formulários de campo de repetição é um tópico de interesse popular entre nossos leitores. Aqui estão algumas respostas rápidas para algumas das perguntas mais comuns:

O que é um campo repetidor?

Um campo repetidor é uma ferramenta versátil que permite aos usuários adicionar dinamicamente vários conjuntos de campos idênticos em um formulário. Imagine-o como um botão "copiar" para um grupo de campos. Ele aumenta a flexibilidade ao inserir dados repetidos, como vários registros.

Por que escolher o campo repetidor do WPForms?

A beleza do campo repetidor do WPForms é que ele facilita a coleta de dados para você e seus visitantes.

• Design centrado no usuário: Ao introduzir campos repetidores, você permite que os usuários determinem a extensão de suas entradas. É um aceno sutil à autonomia do usuário e aprimora a experiência geral do usuário.
• Flexibilidade no design do formulário: Nem todos os formulários são de tamanho único. Com os campos repetidores, você pode atender a vários cenários, seja uma única entrada ou várias entradas, garantindo que o formulário se adapte a diversos requisitos.
• Estruturação consistente de dados: Um dos desafios com vários campos são os dados inconsistentes. Os dados permanecem estruturados e uniformes com campos repetidores, simplificando o processamento e a análise de back-end.
• Redução do tamanho do formulário: Em vez de ter um formulário longo e intimidador com vários campos, os campos repetidos proporcionam uma aparência mais limpa, garantindo que os usuários não fiquem sobrecarregados à primeira vista.

Se você é um empresário que busca uma melhor integração de clientes ou um blogueiro interessado em uma coleta de dados eficiente, o campo repetidor do WPForms é inestimável.

A seguir, saiba como criar um formulário de acordeão no WordPress

Está procurando uma maneira simples de adicionar um design de formulário de acordeão ao seu site WordPress? Confira nosso post sobre o método mais simples de criar um formulário de acordeão usando o WPForms para aumentar a usabilidade e a experiência do usuário do seu site.

Crie seu formulário WordPress agora

Pronto para criar seu formulário? Comece hoje mesmo com o plug-in de criação de formulários mais fácil do WordPress. O WPForms Pro inclui vários modelos gratuitos e oferece uma garantia de reembolso de 14 dias.

Se este artigo o ajudou, siga-nos no Facebook e no Twitter para obter mais tutoriais e guias gratuitos sobre o WordPress.