Há muitas ocasiões em que os usuários dos formulários provavelmente gostariam de poder simplesmente duplicar os campos nos formulários. Campos para nomes extras, detalhes de contato, horas trabalhadas e assim por diante são fáceis de adicionar quando os usuários podem simplesmente repeti-los.
Agora, com o campo WPForms Repeater, os usuários do seu site podem fazer exatamente isso! Neste tutorial, mostrarei como modificar seus formulários para permitir campos duplicados em apenas 5 etapas.
Como permitir que os visitantes dupliquem os campos do formulário
Neste artigo
Primeiro, obtenha o WPForms
Ok, eu sei que eu disse que este tutorial leva apenas 5 etapas, então isso parece extra. 😉 Mas é praticamente certo que você precisará do WPForms instalado e ativado em seu site WordPress para duplicar os campos em seus formulários.
Portanto, obtenha primeiro o plug-in WPForms!
1. Selecione ou crie seu formulário
O campo Repetidor é um ótimo recurso incluído nos formulários que você cria por meio do WPForms. Com ele, os usuários do formulário podem adicionar mais entradas ou duplicar blocos inteiros do formulário.
Mas não é necessário criar um formulário totalmente novo para começar a permitir que os usuários dupliquem campos.
Talvez você já utilize formulários em seu site que gostaria de modificar com o campo Repetidor. Basta clicar em Edit (Editar ) abaixo do formulário para o qual você deseja abrir o construtor de formulários.
Mas, se precisar criar um novo formulário, você pode começar escolhendo entre milhares de modelos de formulários fornecidos na galeria do WPForms.
Oferecemos uma ampla seleção de modelos de formulários que vêm com a funcionalidade do campo Repeater incorporada.
Ou você pode escolher um modelo de formulário diferente e adicionar rapidamente o campo Repetidor com o construtor de formulários.
E, como sempre, você mesmo pode criar seu formulário a partir do zero, começando com um formulário em branco.
Crie seu formulário WordPress agora
2. Adicione o campo Repetidor
Depois de selecionar o formulário e carregá-lo no form builder, você poderá adicionar o campo Repetidor.
Você o verá entre os campos no lado esquerdo da tela.
Basta clicar no campo Repetidor, arrastá-lo para o formulário e soltá-lo onde você quiser.
Em seguida, assim como o campo Layout, o campo Repetidor permite que outros campos do formulário sejam adicionados a ele.
Então, quais campos pertencem à seção de campo Repetidor? Os campos que você deseja permitir que os usuários do formulário dupliquem.
Em um formulário de registro de grupo, por exemplo, os usuários provavelmente gostariam de incluir vários nomes de participantes para se registrarem ao mesmo tempo.
Antes de o WPForms oferecer o campo Repetidor, você poderia ter entupido seu formulário com vários campos Nome que o usuário *poderia* precisar.
Ou você pode ter utilizado configurações de lógica condicional para incluir campos Name adicionais se o usuário quisesse incluir mais.
Seja qual for o caso, o campo Repetidor agora torna a duplicação de campos muito mais fácil para você e para os usuários do formulário!
Leia também: Maneiras de usar o WPForms para sites educacionais
3. Exibir linhas ou blocos
Agora, antes de prosseguirmos, dê uma olhada nas opções de exibição que são aplicadas ao campo Repetidor.
Além de poder personalizar os campos na área de campo Repetidor para serem adicionados como linhas individuais, você também pode permitir que blocos inteiros de campos sejam duplicados.
Dica profissional: Navegue até a guia Advanced para ocultar o rótulo do campo Repeater, como eu fiz.
Quando você seleciona os campos na área Repetidor para serem exibidos como Linhas, os usuários do formulário duplicarão cada linha horizontal.
Como você pode ver acima, os botões + adicionar ou - remover estão no final de cada linha.
Os blocos, por outro lado, são bons para combinar campos a serem repetidos juntos, que não cabem em apenas uma linha.
E com os Blocos, os botões + adicionar ou - remover ficam abaixo de toda a seção de campos. Falaremos mais sobre esses botões posteriormente.
No meu exemplo abaixo, selecionei Blocos como a forma de exibir meus campos repetíveis. Em seguida, incluí os campos na área do campo Repetidor que desejo que os usuários possam duplicar como uma seção.
Agora, quando os usuários do formulário adicionam outro participante, eles podem fornecer todas as informações que solicitei no formulário para cada bloco.
Dessa forma, os usuários do formulário podem duplicar seções inteiras do formulário de uma só vez.
4. Escolha um layout
Em seguida, verifique as diferentes maneiras de organizar o layout de seus campos repetíveis.
Você pode configurar seus campos em linhas simples, colunas com espaçamento uniforme e colunas irregulares.
Se você tiver linhas repetidas de nomes e idades de participantes, por exemplo, poderá escolher um layout que posicione um espaço maior para o nome e um espaço menor para a idade.
Portanto, meu exemplo de colunas Rows e Layout no construtor de formulários acima teria a seguinte aparência para um usuário do formulário:
Ou, lembra-se do bloco que mostrei no final da etapa 3 com o nome do participante, as informações de contato de emergência e outros campos?
Eu poderia utilizar um layout de 2 colunas para personalizar essa parte do formulário.
Então, para o usuário, seria algo parecido com isto:
Dica profissional: Use um campo Name simples, de uma linha, para manter as colunas uniformemente espaçadas, como fiz acima.
A modificação desses aspectos do campo Repetidor apenas ajuda a manter tudo limpo e organizado em todo o formulário.
5. Personalizar a exibição de botões
A última coisa a ser personalizada na seção do campo repetidor são os botões + e - para adicionar e remover campos repetidos.
Esses são os botões em que o usuário do formulário clicará para adicionar nomes, seções de registro ou quaisquer outros campos que você tenha disponibilizado para duplicação.
Por padrão, esses botões exibem + ou - no final de cada linha, mas você pode personalizar esses ícones ao utilizar um bloco.
Como os botões estão alojados abaixo do bloco, e não no final da linha, permitir que ele se torne mais longo por meio da personalização ainda mantém as coisas visualmente organizadas.
Primeiro, selecione o tipo de botão.
As opções aqui incluem:
- Botões com ícones
- Botões
- Ícones com texto
- Ícones
- Texto simples
Se o seu botão exibir algum tipo de texto, você poderá personalizá-lo na próxima caixa. É aqui que você pode alterar o texto do rótulo do botão.
Em um formulário de registro de grupo, por exemplo, você pode personalizar o botão como "Add Participant" (Adicionar participante).
Por fim, você pode escolher o limite mínimo e máximo para seus campos repetíveis.
Por padrão, esse Limite é definido com um mínimo de 1 e um máximo de 10. Isso significa que os usuários do formulário podem registrar até 10 participantes nesse formulário.
Portanto, ao aplicar as configurações mostradas acima, o botão do nosso formulário de registro de grupo teria a seguinte aparência para os usuários:
Como sempre, quando estiver satisfeito com seus campos personalizados e repetíveis, certifique-se de salvar seu formulário para publicá-lo quando estiver pronto.
E isso é tudo! Agora você sabe como permitir que os visitantes do site dupliquem campos em seus formulários.
Bônus: O campo repetidor em ação
Já mostrei como usar a área de campo Repetidor em um formulário de registro de grupo, mas gostaria de compartilhar alguns outros bons exemplos desse recurso em ação.
Formulário de folha de ponto do funcionário
Primeiro, dê uma olhada nesta planilha de horas do funcionário que oferecemos como modelo:
Os detalhes do funcionário são coletados primeiro, incluindo o nome, o e-mail e o ID do funcionário, além do total de horas da semana.
Os funcionários podem então inserir seus dias e horas específicos trabalhados na semana, essencialmente usando esse formulário como uma planilha de horas semanal.
Ele utiliza blocos e colunas repetíveis que permitem que os usuários dupliquem campos para o dia da semana em que trabalharam, juntamente com a hora de entrada e a hora de saída desse dia. Esses campos podem ser repetidos até 14 vezes, ou seja, uma semana de turnos duplos.
Deseja usar esse formulário em seu site? Obtenha o modelo!
Formulário de registro de classe
Agora, dê uma olhada nesta lista de turmas que também oferecemos como modelo:
Ele começa reunindo as informações do professor para facilitar o rastreamento de cada envio.
Em seguida, com o campo Repetidor, os professores podem adicionar facilmente informações sobre cada aluno da lista, como série, data de nascimento ou qualquer outro dado que queiram incluir para manutenção de registros.
Os professores podem usar essa lista para até 20 alunos. Ou, como sempre, esse modelo de formulário é totalmente personalizável, de modo que o número máximo de registros permitidos pode ser modificado.
Gostou deste formulário? Obtenha o modelo!
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.
Por que devo permitir que os visitantes dupliquem os campos do formulário?
É bom para os usuários do formulário! Permitir que os visitantes dupliquem campos de formulário facilita muito o processo de preenchimento de formulários, principalmente quando os usuários precisam inserir informações semelhantes ou repetitivas. Isso pode poupar o tempo dos visitantes do seu site e tornar a experiência de preenchimento de formulários mais conveniente e eficiente.
E isso também é bom para você! Quando os usuários podem duplicar campos de formulário, fica mais fácil coletar e organizar dados para análise, pois pontos de dados semelhantes são agrupados e mais gerenciáveis.
Além disso, ele simplesmente mantém seu formulário organizado e visualmente atraente. Os visitantes do seu site não ficarão sobrecarregados com longas seções de campos vazios, e você não precisará criar uma trilha complicada de regras de lógica condicional para manter os campos adicionais ocultos.
O Campo de Repetição é um ganho para todos!
PERGUNTAS FREQUENTES
No WPForms, estamos sempre felizes em oferecer orientação sobre os recursos e as ferramentas que fornecemos. Portanto, aqui estão as respostas para algumas de nossas perguntas mais frequentes sobre a duplicação de campos de formulário:
O que significa permitir que os visitantes dupliquem os campos do formulário?
Permitir que os visitantes dupliquem campos de formulário significa oferecer a eles a opção de criar várias instâncias de um campo específico em um formulário. Dessa forma, eles podem inserir informações semelhantes ou repetitivas com mais eficiência.
No WPForms, nós nos referimos a essas duplicatas como campos repetidores, pois os usuários do formulário podem repetir esses campos para inserir mais informações.
Como posso implementar a duplicação de campos nos formulários do meu site?
Os métodos de implementação podem variar de acordo com a plataforma ou as ferramentas que você estiver usando.
Quanto ao WPForms, habilitamos a duplicação de campos com um simples clique ou ação de arrastar e soltar. Em outros casos, talvez seja necessário usar código personalizado ou plugins para adicionar essa funcionalidade.
Devo definir um limite para o número de vezes que um campo de formulário pode ser duplicado?
A definição de limites pode ajudar a manter a usabilidade do formulário e evitar que os usuários criem um número excessivo de campos, o que pode afetar o desempenho do formulário ou o gerenciamento de dados.
Com o campo WPForms Repeater, é possível definir um limite máximo para entradas duplicadas, de modo que você controle esse aspecto do formulário.
Crie seu formulário WordPress agora
Em seguida, confira este guia rápido e fácil
Já compartilhei várias informações sobre como permitir que os visitantes dupliquem campos, mas há ainda mais a aprender sobre o uso do campo Repetidor. Esse recurso oferece tantas opções que há muito a ser abordado.
Para saber mais algumas dicas rápidas e fáceis, incluindo ideias de personalização não abordadas aqui, não deixe de dar uma olhada no nosso tutorial de campo do repetidor.
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.
