Já vimos isso acontecer muitas vezes: alguém começa a preencher um formulário no seu site WordPress, mas o abandona no meio do caminho. Talvez o formulário peça detalhes que eles já forneceram, ou talvez pareça muito longo.
É aí que o preenchimento dinâmico de campos pode ajudar. Ele permite que você preencha automaticamente campos de formulário com informações que você já sabe sobre seus visitantes, como o nome de um perfil de usuário ou detalhes passados por meio de uma URL.
Após testar vários plugins, o WPForms se destaca como a opção mais eficaz. Somos grandes fãs dele aqui no WPBeginner porque ele torna a criação de formulários inteligentes e fáceis de usar incrivelmente simples.
Se você deseja criar formulários mais fluidos que as pessoas realmente completem, você está no lugar certo.
Neste guia, mostraremos como configurar o preenchimento dinâmico de campos no WordPress usando o WPForms. Dessa forma, você pode melhorar a experiência do usuário enquanto ainda coleta os dados de que precisa.
O Que É Preenchimento Dinâmico de Campos?
Preenchimento dinâmico de campos é uma técnica que permite aos proprietários de sites preencher automaticamente campos de formulário com base na seleção do usuário, tipo de formulário, strings de consulta ou lógica condicional.
Por exemplo, uma loja de comércio eletrônico pode criar um formulário onde o campo do produto no formulário é preenchido dinamicamente usando produtos existentes no WooCommerce ou qualquer outro software de comércio eletrônico.
Da mesma forma, um site imobiliário pode preencher automaticamente campos de listagens, corretores e tipo de propriedade em seus formulários de agendamento e geração de leads.
Usuários avançados e desenvolvedores também podem usar parâmetros de URL para preencher campos de formulário dinamicamente usando links inteligentes de boletins por e-mail ou outras interações do site.
Com isso em mente, mostraremos como usar facilmente o preenchimento dinâmico de campos no WordPress. Aqui está uma visão geral rápida de todas as etapas que abordaremos neste guia:
- Método 1. Preencher Arquivos de Formulário Automaticamente Usando Preenchimento Dinâmico de Campos
- Método 2. Preencher Campos de Formulário Automaticamente Usando Parâmetros de URL
- Dica Bônus: Adicionar Autocompletar para Campos de Endereço
- FAQ: Preenchimento Dinâmico de Campos no WordPress para Preencher Formulários Automaticamente
- Mais Guias para Melhorar Formulários do WordPress
Vamos começar!
Método 1. Preencher Arquivos de Formulário Automaticamente Usando Preenchimento Dinâmico de Campos
Primeiro, você precisa instalar e ativar o plugin WPForms. Para mais detalhes, veja nosso guia passo a passo sobre como instalar um plugin do WordPress.
O WPForms é o melhor plugin de formulário de contato do WordPress do mercado. Ele permite que você crie facilmente formulários online usando uma ferramenta simples de arrastar e soltar.
Ele também vem com preenchimento dinâmico de campos, lógica condicional e campos de formulário avançados. Juntos, esses recursos permitem que você crie formulários mais inteligentes e interativos em seu site.
Na WPBeginner, usamos o WPForms para criar nosso formulário de contato. Temos uma ótima experiência com ele, e você pode ver nossa análise completa do WPForms para mais informações.
Após ativar o plugin, você precisa visitar a página WPForms » Configurações para inserir sua chave de licença. Você pode encontrar essa informação em sua conta no site do WPForms.
💡 Observação: Existe também uma versão gratuita do WPForms que você pode experimentar para ver se gosta da plataforma.
Em seguida, você precisa visitar WPForms » Adicionar Novo para criar seu primeiro formulário.
Você será solicitado a fornecer um nome para seu formulário e, em seguida, escolher como deseja criá-lo.
Com o WPForms, você pode começar com uma tela em branco, usar o Construtor de Formulários com IA ou selecionar um modelo pré-fabricado. Se você quiser usar o WPForms AI, tudo o que você precisa fazer é escrever um prompt e a ferramenta gerará o formulário para você.
Para este tutorial, no entanto, usaremos um modelo.
O WPForms vem com mais de 2.000 modelos para escolher. Para refinar a escolha, você pode usar a barra de pesquisa e digitar “order”.
Depois de encontrar o modelo que deseja usar, basta passar o mouse sobre ele e clicar em ‘Usar Modelo’. Por exemplo, usaremos o modelo ‘Formulário de Cobrança / Pedido’.
O WPForms carregará seu formulário com campos pré-selecionados. Você pode clicar para editar os campos do formulário ou usar o recurso de arrastar e soltar para movê-los para cima e para baixo. Você também pode adicionar e remover campos do formulário com apenas um clique.
Vamos agora adicionar um novo campo ao formulário para preenchê-lo com escolhas dinâmicas.
Você pode adicionar um campo de lista suspensa, múltipla escolha ou caixa de seleção ao seu formulário para usar opções de escolha dinâmicas. Simplesmente clique em um campo da coluna esquerda e arraste-o para adicioná-lo ao seu formulário.
🧑💻 Dica Pro: Você pode usar Escolhas de IA para gerar as opções para seu campo de lista suspensa, múltipla escolha ou caixa de seleção. Assim, em vez de digitar manualmente cada escolha, você pode inserir um prompt como “Tipos de materiais para camisetas” ou “Lista de sabores populares de bolo”, e o WPForms gerará as opções para você.
Em seguida, você pode clicar para editar os campos do formulário.
Simplesmente mude para o menu Avançado na coluna esquerda.
A partir daqui, você precisa selecionar ‘Escolhas Dinâmicas’.
O WPForms suporta tipos de postagem e taxonomias registradas em seu site WordPress.
Para este tutorial, selecionaremos ‘Tipo de Postagem’ como ‘Escolhas Dinâmicas’ e ‘Produtos’ como a ‘Origem de Postagem Dinâmica’.
O WPForms agora carregará e exibirá automaticamente os campos na pré-visualização do formulário.
Para incorporar o formulário, basta clicar no botão ‘Incorporar’ na parte superior do construtor de formulários. A partir daqui, você pode selecionar uma página existente para incorporar o formulário ou criar uma nova página.
Alternativamente, você pode usar o bloco WPForms para adicionar o formulário a uma postagem ou página do WordPress. Vá em frente e edite a postagem ou página onde você deseja adicionar o formulário.
Uma vez que você esteja no editor de conteúdo do WordPress, você pode adicionar o bloco WPForms à sua área de edição de postagem. Depois disso, basta selecionar o formulário que você criou anteriormente no menu suspenso.
Agora você pode salvar sua postagem ou página.
Em seguida, você pode querer visitar seu site para ver seu formulário com valores de campo dinâmicos em ação.
Método 2. Preencher Campos de Formulário Automaticamente Usando Parâmetros de URL
O WPForms também permite preencher campos de formulário dinamicamente usando parâmetros de URL. Este recurso permite que você crie links inteligentes que passam automaticamente informações para o formulário e o preenchem para que seus usuários o enviem.
Primeiro, você precisa criar um novo formulário ou editar um existente no WPForms. Depois de terminar de criar seu formulário, você vai querer mudar para a aba ‘Configurações’ na coluna esquerda e depois selecionar a aba ‘Geral’.
Nesta tela, você precisa clicar no alternador para a opção ‘Habilitar Preenchimento por URL’.
Agora você pode salvar seu formulário e sair do construtor de formulários. Seu formulário está pronto para preencher campos dinamicamente usando parâmetros de URL.
Criando Links com Parâmetros de URL
O WPForms aceita campos de formulário dinâmicos passados através de parâmetros de URL em um formato específico.
https://example.com/contact/?wpf15_1=value
Vamos detalhar.
- A parte da URL antes do ponto de interrogação ‘?’ é o URL da página que contém seu formulário. Por exemplo, a página do seu formulário de contato.
- ?wpf – Indica o início dos parâmetros de campo do formulário WPForm.
- 15 – É o ID do seu formulário
- _1 – É o ID do campo
- =valor – = Indica o início do valor que você deseja passar para o formulário, seguido pelo valor real do campo.
Aqui está um exemplo de um URL onde estamos passando um título de produto como um campo de texto para um formulário de feedback.
https://example.com/contact/?wpf15_2=Vintage%20Flower%20Vase
Aqui, observe como usamos %20 para indicar espaços entre palavras no título do produto.
Encontrando IDs de Formulário e Campo no WPForms
Para criar parâmetros de URL, você precisará saber os IDs do formulário e do campo.
Para encontrar esses valores, basta editar seu formulário e você verá o ID do formulário na barra de endereço do seu navegador.
Da mesma forma, para encontrar o ID do campo do formulário, você só precisa clicar nele para editá-lo.
Você verá as propriedades do campo do formulário na coluna da esquerda, juntamente com o ID do campo no topo.
Agora, e se você quisesse passar um valor para um subcampo?
Simplesmente adicione o identificador do subcampo após o ID do campo em sua URL assim:
https://example.com/contact/?wpf15_3_city=london
Para mais detalhes, você pode consultar a documentação do desenvolvedor do WPForms, que mostra mais exemplos de uso de diferentes parâmetros para todos os tipos de campos de formulário.
Agora você pode usar este recurso em combinação com seu software de CRM ou serviço de e-mail marketing para enviar links de formulário inteligentes para seus usuários. A maioria das plataformas de marketing vem com suas próprias tags MERGE personalizadas que você pode adicionar na URL inteligente para preencher automaticamente informações pessoais no formulário.
⚠️ Aviso: Você também pode usar o recurso de preenchimento dinâmico de campos com outros plugins de formulário como Formidable Forms, Gravity Forms, ou outros. No entanto, recomendamos o uso do WPForms porque ele torna todo o processo fácil, e o conhecemos bem porque o criamos.
Para mais detalhes, consulte nossa comparação entre WPForms vs Formidable Forms vs Gravity Forms.
Dica Bônus: Adicionar Autocompletar para Campos de Endereço
Outra forma de aprimorar seus formulários é adicionando campos de endereço com preenchimento automático no WordPress. Esse recurso torna mais rápido e fácil para os usuários inserirem seus endereços, ao mesmo tempo que reduz erros.
Por exemplo, em uma loja online, o preenchimento automático pode agilizar o checkout.
À medida que os clientes começam a digitar seus endereços, opções sugeridas aparecem com base em sua localização atual. Essas sugestões são frequentemente alimentadas pelas APIs do Google Places e Google Maps.
Ao ajudar os compradores a agilizar o checkout, você pode aumentar as vendas e incentivar a fidelidade dos clientes.
Para saber mais, consulte nosso guia sobre como configurar o preenchimento automático para campos de endereço no WordPress.
FAQ: Preenchimento Dinâmico de Campos no WordPress para Preencher Formulários Automaticamente
Agora que você sabe como configurar o preenchimento dinâmico de campos no WordPress, vamos abordar algumas perguntas comuns que os usuários têm sobre como ele funciona.
O que é preenchimento dinâmico de campos?
O preenchimento dinâmico de campos é o processo de preencher automaticamente campos de formulário com informações que você já possui sobre seus usuários. Isso pode ser dados do perfil do usuário ou detalhes passados através de uma URL.
Isso otimiza a experiência de preenchimento de formulários, tornando-a mais rápida, mais amigável e ajuda a reduzir o abandono de formulários.
Quão seguro é usar parâmetros de URL para preenchimento dinâmico de campos?
O uso de parâmetros de URL é geralmente seguro, desde que seu site esteja rodando em HTTPS, que criptografa os dados em trânsito.
Dito isso, você deve sempre manter seu site WordPress e plugins de formulário atualizados e seguir as práticas recomendadas básicas de segurança para proteger informações confidenciais.
Posso usar preenchimento dinâmico de campos com qualquer plugin de formulário?
Muitos plugins de formulário premium suportam o preenchimento dinâmico de campos, incluindo o WPForms, que recomendamos por sua facilidade de uso e flexibilidade.
Apenas certifique-se de verificar a compatibilidade e as configurações com seu plugin específico. O WPForms, que recomendamos, oferece suporte e documentação extensivos para implementar este recurso.
Quais são os benefícios do preenchimento dinâmico de campos?
Este recurso melhora a experiência do usuário, economizando tempo e minimizando a entrada repetitiva. Como resultado, os usuários são mais propensos a preencher seus formulários, o que pode levar a taxas de conversão mais altas. É especialmente útil para páginas de checkout de comércio eletrônico, formulários de captura de leads e registro de usuários.
Mais Guias para Melhorar Formulários do WordPress
Esperamos que este artigo tenha ajudado você a aprender como usar o preenchimento dinâmico de campos no WordPress para preencher formulários automaticamente. Você também pode consultar nossos guias sobre:
- Melhores Construtores de Formulários Online
- Como Estilizar e Personalizar Seus Formulários do WordPress
- Como Criar Formulários AMP no WordPress
- Como Criar Formulários Multilíngues no WordPress
- Como Criar Formulários Conversacionais no WordPress
- Como rastrear a jornada do usuário em formulários de leads do WordPress
- Dicas para Criar Formulários Mais Interativos no WordPress e Aumentar Conversões
- O Guia Definitivo para Usar Formulários no WordPress
Se você gostou deste artigo, por favor, inscreva-se em nosso Canal do YouTube para tutoriais em vídeo do WordPress. Você também pode nos encontrar no Twitter e no Facebook.
David R
Olá, ótimo artigo!
Eu estava me perguntando se isso funcionaria com um código QR. Em outras palavras, posso criar um QR code a partir desta URL com todos os parâmetros de campo do formulário e, quando escaneado, ele direcionará o usuário para a página e preencherá todos os campos?
Obrigado.
WPBeginner Support
As long as it keeps the URL parameters it should work
Admin