Como Usar Strings de Consulta para Pré-preencher Campos de Formulário de Outro Formulário

Você quer otimizar a experiência de preenchimento de formulários dos seus usuários no WordPress? O preenchimento automático de campos de formulário com informações de um formulário anterior pode aprimorar a experiência do usuário e garantir a precisão dos dados. Este tutorial irá guiá-lo através do processo de passagem de informações entre formulários usando strings de consulta pré-preenchidas.

Antes de entrarmos nas etapas para conseguir isso, vamos mergulhar um pouco sobre strings de consulta e por que elas são incríveis!

O Que São Strings de Consulta?

Pense nas strings de consulta como mensageiros úteis entre diferentes partes do seu site. Elas são pedaços de informação adicionados ao final de um URL, ajudando as páginas da web a se comunicarem umas com as outras. Você geralmente as verá após um ponto de interrogação em um endereço da web, seguido por pares de chave-valor separados por ampersands.

Como Elas Funcionam?

Imagine que você está preenchendo um formulário em um site. Quando você clica em Enviar, o formulário envia seus dados para o servidor do site. Mas e se você quiser passar esses dados para outro formulário ou página sem fazer os usuários preencherem novamente? É aí que entram as strings de consulta.

Ao adicionar strings de consulta ao URL de redirecionamento após o envio do formulário, você está essencialmente dizendo: Ei, aqui estão algumas informações do primeiro formulário. Use-as para pré-preencher campos no próximo! É como deixar um rastro de migalhas para o seu site seguir.

Por Que Elas São Benéficas?
  1. Economiza Tempo: Os usuários adoram conveniência. As strings de consulta os poupam do incômodo de digitar novamente informações que já forneceram.
  2. Precisão: Você já cometeu um erro de digitação ao preencher um formulário? Com as strings de consulta, você está extraindo dados diretamente do primeiro formulário, reduzindo a chance de erros.
  3. Maiores Conversões: Ao otimizar o processo de preenchimento de formulários, você está facilitando para os usuários a conclusão de ações em seu site, levando a taxas de conversão mais altas.
  4. Experiência Impecável: Tudo se resume a uma navegação tranquila para seus usuários. O preenchimento automático de formulários cria uma jornada impecável em seu site, aprimorando a experiência do usuário.

Em resumo, as strings de consulta são como fios mágicos conectando diferentes partes do seu site. Elas passam informações entre formulários, facilitando a vida tanto para você quanto para seus usuários. Com menos digitação e mais automação, todos ganham!

Dito isso, vamos começar!

Usando as strings de consulta

Começaremos criando dois formulários separados. Se precisar de ajuda para criar formulários, consulte esta documentação.

1) Criando o formulário da página inicial

Primeiro, crie seu primeiro formulário e adicione todos os campos que você precisa a este formulário.

Clique em Salvar por enquanto, pois revisitaremos este formulário mais tarde.

crie o primeiro formulário com nome e endereço de e-mail

2) Criando um formulário adicional

Nesta etapa, criaremos outro formulário que receberá as informações pré-preenchidas. Adicione todos os campos necessários, garantindo que eles correspondam às informações que você deseja pré-preencher.

Em seguida, navegue até a guia Configurações » Geral e clique na seta suspensa para entrar nas opções Avançadas. Aqui, você pode ativar o botão para Ativar preenchimento automático por URL.

certifique-se de lembrar de ativar a opção em Configurações, Geral, Avançado para Habilitar Preenchimento por URL

3) Configurando o redirecionamento ao enviar o formulário

Agora é hora de juntar tudo. Vamos editar o formulário que criamos na primeira etapa, o formulário da página inicial. No construtor de formulários, vá para Configurações » Confirmações.

Uma vez aqui, altere o Tipo de Confirmação para Ir para URL (Redirecionamento) e no campo URL de Redirecionamento de Confirmação, copie e cole este URL.

http://example.com/quote/?wpf1036_1={field_id="1"}&wpf1036_2={field_id="2"}

Com o URL acima, haverá algumas coisas que você precisará alterar. Como:

  1. Substitua exemplo.com pelo seu próprio domínio.
  2. Substitua a palavra quote pelo nome da sua página.
  3. Ajuste wpf1036_1 e wpf1036_2 para corresponder ao ID do formulário de destino e aos respectivos IDs de campo.
  4. Atualize {field_id="1"} com o ID do campo do formulário da página inicial para o campo Nome.
Após configurar sua URL de confirmação, você estará pronto para pré-preencher campos de formulário

Se precisar de ajuda para encontrar os números específicos dos seus IDs de campo, dê uma olhada neste tutorial.

Depois de adicionar isso ao seu URL de Redirecionamento de Confirmação, clique em Salvar no formulário.

Agora, quando os usuários virem o formulário da página inicial, eles poderão preencher o nome e o endereço de e-mail e, quando clicarem no botão Enviar , a página será redirecionada para outro formulário que pré-populará automaticamente os campos Nome e Endereço de E-mail com as informações coletadas do formulário em sua página inicial.

pré-preencher campos de formulário

E é tudo o que você precisa para usar uma string de consulta para pré-popular os campos do seu formulário. Gostaria de ver com quais outros campos você pode usar isso? Dê uma olhada em nossa documentação sobre Como Ativar a Configuração de Preenchimento Automático por URL no WPForms.

Perguntas Frequentes

P: Por que não está pré-popularndo o próximo formulário?

R: Se você notar que seus campos não estão sendo pré-populados, verifique se no seu segundo formulário você ativou a configuração.

Abra o construtor de formulários do segundo formulário e vá para a guia Configurações » Geral. Em seguida, clique no menu suspenso Avançado na parte inferior da tela e ative o botão para Ativar preenchimento automático por URL.

Habilitar Preenchimento por URL na aba avançada em Configurações Gerais

P: O que devo fazer se estiver usando nome e sobrenome para o meu campo de nome?

R: Se você não estiver usando o formato Simples para o seu nome, você apenas listaria seu campo de nome na URL assim.

http://my-example-site.com/quote/?wpf1036_1_first={field_id="1|first"}&wpf1036_1_last={field_id="1|last"}&wpf1036_2={field_id="2"}

O mesmo pode ser dito para o campo Endereço. Seu formato para detalhar o endereço apareceria assim.

&wpf1036_3_address1={field_id="3|address1"}&wpf1036_3_address2={field_id="3|address2"}&wpf1036_3_city={field_id="3|city"}&wpf1036_3_state={field_id="3|state"}&wpf1036_3_postal={field_id="3|postal"}