Como Criar Formulários WordPress com Campos de Lista Suspensa (Método Fácil)

Visitantes começam a preencher seu formulário de contato e, de repente, o abandonam no meio do caminho. Essa é uma das experiências mais frustrantes para qualquer proprietário de site, especialmente quando você sabe que esses leads poderiam transformar seu negócio.

A verdade é que formulários longos intimidam os usuários e criam atrito desnecessário em seu processo de conversão.

Após anos ajudando proprietários de sites WordPress a otimizar seus formulários, descobrimos que o uso de campos de lista suspensa pode melhorar suas taxas de conclusão de formulários.

Além disso, esses elementos simples não apenas economizam espaço precioso na tela, mas também guiam os usuários a fornecer exatamente as informações que você precisa saber sobre eles.

Neste tutorial, mostraremos a maneira mais fácil de criar formulários WordPress com campos de lista suspensa que os visitantes realmente querem preencher.

O Que São Campos de Lista Suspensa e Por Que Usá-los?

Um campo de lista suspensa permite que os usuários escolham uma opção de uma lista definida de variações diferentes. Os usuários podem simplesmente clicar no campo para ver todas as opções de lista suspensa.

Como proprietário de um site, você pode usar campos de lista suspensa para criar formulários da web, como formulários de contato, formulários de registro de eventos, cadastros para boletins informativos por e-mail ou formulários de pedido de produto.

Campos de lista suspensa podem melhorar a eficácia do seu formulário. Aqui estão algumas vantagens:

• Consistência. A lista definida de opções mantém os dados coletados consistentes e evita entradas inválidas. Isso torna a análise de dados mais precisa.
• Campos dinâmicos. Campos de lista suspensa facilitam a configuração de lógica condicional. A lista definida de opções permite que você exiba campos adicionais com base na seleção do usuário, sem obstáculos desnecessários.
• Redução do comprimento do formulário. Combinar várias opções em um menu suspenso compacto faz com que seu formulário pareça menos intimidador. Isso pode resultar em uma melhor experiência do usuário.

Dito isso, vamos ver como criar formulários com campos de lista suspensa no WordPress. Aqui está uma visão geral rápida das etapas que abordaremos neste tutorial:

• Etapa 1: Instalando o Melhor Plugin de Formulário de Contato
• Etapa 2: Criando um Novo Formulário Usando o WPForms
• Etapa 3: Adicionando o Campo de Lista Suspensa ao Seu Formulário
• Etapa 4: Configurando Listas Suspensas com Opções e Lógica Condicional
• Etapa 5: Personalizando as Notificações e Confirmações do Seu Formulário
• Etapa 6: Incorporando Seu Formulário no WordPress
• Etapa 7: Publicando o Novo Formulário no Seu Site WordPress
• Dica Bônus: Maneiras Criativas de Usar Campos de Lista Suspensa
• Perguntas Frequentes: Usando Campos de Lista Suspensa em Formulários WordPress
• Recursos Adicionais: Domine Seus Formulários WordPress

Vamos começar!

Etapa 1: Instalando o Melhor Formulário de Contato Plugin

WPForms é o melhor plugin de formulário de contato para WordPress. Ele possui ferramentas de IA e mais de 2.000 modelos, que ajudam você a criar formulários em apenas alguns cliques.

Na WPBeginner, usamos o WPForms para criar nossos formulários de contato, pesquisas anuais de usuários e solicitações de migração, e não poderíamos estar mais satisfeitos!

Sinta-se à vontade para aprender sobre todos os seus recursos em nossa análise completa do WPForms.

Então, vamos instalar e ativar o plugin WPForms. Você pode ir para Plugins » Adicionar Novo Plugin no seu painel do WordPress.

Na próxima tela, você pode usar o botão de pesquisa para encontrar o plugin WPForms. Uma vez encontrado, você pode clicar em ‘Instalar Plugin’ e depois em ‘Ativar’.

Para instruções detalhadas, você pode ler nosso guia sobre como instalar um plugin do WordPress.

Etapa 2: Criando um Novo Formulário Usando o WPForms

Após a ativação, você deverá ver um menu WPForms na sua área de administração do WordPress como este:

Agora, você poderá acessar a interface do construtor do WPForms e criar formulários com campos de seleção (dropdown).

Para começar a construir um novo formulário, você pode ir para WPForms » Adicionar Novo.

Agora, você verá o painel ‘Configuração’ dentro do construtor de formulários do WPForms. Neste painel, a primeira coisa que você precisará fazer é nomear seu formulário.

Por exemplo, você pode digitar ‘Formulário de Contato Simples’ ou apenas ‘Formulário de Contato’ no campo ‘Nomeie seu Formulário’.

Assim que isso for feito, é hora de escolher como você construirá seu formulário do WordPress.

Com o WPForms, você pode criar do zero, escolher um modelo pré-fabricado ou usar o construtor de formulários com inteligência artificial.

Se você quiser usar o construtor de formulários com IA, tudo o que você precisa fazer é inserir um prompt simples. A IA gerará o formulário para você em alguns segundos.

Para este guia, no entanto, vamos usar ‘Formulário de Contato Simples’.

Para usar um modelo de formulário, tudo o que você precisa fazer é passar o mouse sobre o que deseja e clicar em ‘Usar Modelo’.

Para instruções passo a passo, consulte nosso guia detalhado sobre como criar um formulário de contato no WordPress.

Etapa 3: Adicionando o Campo de Lista Suspensa ao Seu Formulário

Após concluir o processo de configuração, você será redirecionado para o construtor de formulários, onde há uma lista de campos à esquerda e uma pré-visualização em tempo real à direita.

Agora, queremos adicionar um campo de seleção ao nosso formulário de contato.

Simplesmente arraste ‘Seleção’ e solte-o no lado direito do formulário.

À direita do painel, você poderá ver um campo de seleção em seu formulário de contato. Você pode passar o mouse sobre o campo para acessar suas configurações, que incluem:

• Um botão de cópia
• Um botão de exclusão
• Uma instrução ‘Clique para Editar’
• Uma instrução ‘Arraste para Reordenar’

Usando o recurso de arrastar e soltar, vamos mover o campo de seleção para cima de ‘Comentário ou Mensagem’.

Ao ter o campo de parágrafo ‘Comentário ou Mensagem’ logo antes do botão de envio, você oferece um melhor fluxo para o processo de conclusão do formulário. Isso também torna seu campo de seleção mais visível para que os usuários não o ignorem.

Etapa 4: Configurando Listas Suspensas com Opções e Lógica Condicional

Nesta etapa, você definirá o rótulo, as opções e a descrição do seu campo de seleção. Sua lista de opções deve estar alinhada com o tipo do seu formulário. Como estamos criando um formulário de contato, vamos oferecer uma opção de assinatura de newsletter.

Clique no seu campo de seleção e, em seguida, vá para ‘Opções do Campo’.

Na aba ‘Geral’, preencha os detalhes necessários:

• Rótulo. Em campos de lista suspensa, os rótulos geralmente são perguntas. Usaremos ‘Gostaria de assinar nossa newsletter?’ como exemplo.
• Opções. Vamos adicionar ‘Sim, por favor.’ e ‘Não, obrigado.’
• Descrição. Você pode deixar ‘Você pode cancelar a inscrição a qualquer momento.’ neste campo.
• Obrigatório. Ative esta opção para exigir que os visitantes preencham este campo.

Em seguida, vamos configurar a lógica condicional.

Lógica condicional significa tomar decisões com declarações ‘se’ e ‘então’. Quando usada em formulários, ela decide o que acontece a seguir com base na resposta que um usuário dá.

Configurar a lógica condicional torna os formulários mais fáceis de preencher. Ao mostrar apenas opções relevantes com base em seleções anteriores, seu formulário não sobrecarrega os usuários com escolhas desnecessárias.

Neste exemplo, vamos exibir um campo adicional se os usuários escolherem a opção ‘Sim, por favor’. Permitiremos que os assinantes escolham com que frequência eles gostariam de receber e-mails promocionais.

Antes disso, você precisará preparar um novo campo. Volte para a aba ‘Adicionar Campos’ e clique em ‘Menu Suspenso’ ou em qualquer outro tipo de campo. Em seguida, complete os detalhes do novo campo.

Aqui está um exemplo:

Agora que o novo campo está pronto, clique nele e navegue até a aba ‘Lógica Inteligente’.

A partir daqui, você pode ativar a lógica condicional ativando a opção ‘Ativar Lógica Condicional’.

Uma vez ativada, você pode configurar a lógica condicional para o seu novo campo.

Comece escolhendo ‘Mostrar’ ou ‘Ocultar’ o novo campo. Em seguida, selecione um campo existente e uma entrada do usuário.

Aqui está nossa configuração como referência: ‘Mostrar’ este campo se ‘Você gostaria de assinar nossa newsletter’ for ‘Sim, por favor’.

Etapa 5: Personalizando as Notificações e Confirmações do Seu Formulário

É hora de personalizar seu novo formulário.

Você pode começar configurando notificações por e-mail toda vez que um novo usuário enviar um formulário. Vá para Configurações » Notificações e ative a opção ‘Ativar Notificações’.

Em seguida, revise os detalhes de notificação padrão do seu formulário abaixo do interruptor.

Algumas entradas no campo ‘Notificação Padrão’ possuem ‘Smart Tag’. Essa tag assume para onde enviar notificações de envio de formulário, entre outras coisas. Dito isso, você pode ajustar as configurações com base em suas necessidades.

Por exemplo, o campo ‘Endereço de E-mail para Envio’ possui a ‘Smart Tag’ {admin_email}. Por padrão, este será o e-mail do administrador do seu site WordPress. Assim, quaisquer notificações de envio de formulário irão para a caixa de entrada do e-mail do administrador.

Você pode adicionar mais destinatários, como seu especialista em marketing por e-mail. Apenas certifique-se de separar cada e-mail com uma vírgula.

Se você quiser aprender como enviar o e-mail do seu formulário para várias pessoas ou departamentos diferentes, leia nosso guia sobre como criar um formulário de contato com múltiplos destinatários.

Em seguida, o texto padrão para sua ‘Linha de Assunto do E-mail’ é ‘Nova Entrada: Nome do Seu Formulário’. No entanto, você pode alterar a linha de assunto como desejar, desde que seja fácil de identificar.

Os usuários que enviarem um formulário devem receber uma notificação em seus e-mails. O campo ‘Nome do Remetente’ informa aos usuários quem está enviando o e-mail de notificação.

O próximo campo é ‘E-mail do Remetente’, e a ‘Smart Tag’ para este campo é {admin_email}.

Com esta configuração padrão, os usuários receberão e-mails de notificação do e-mail de administrador do seu site.

A parte destacada informa que o endereço de e-mail de administrador do seu site está em um domínio diferente, por exemplo, @gmail.com. Isso pode levar a problemas de entrega, como e-mails que acabam na caixa de ‘Spam’.

Você pode ler nosso guia sobre como configurar o WP Mail SMTP para garantir que seus e-mails cheguem às caixas de entrada dos leitores.

Para cada e-mail de notificação enviado, o destinatário também tem a opção de responder a ele.

No campo ‘Responder para’, você pode definir qual endereço de e-mail receberá as respostas dos usuários. A ‘Tag Inteligente’ deste campo é {field_id= “1”}. Isso significa que as respostas dos usuários irão para o mesmo endereço de e-mail do campo ‘E-mail de Remetente’.

Por fim, o campo ‘Mensagem de E-mail’ possui a tag inteligente {all_fields}. Assim, sua mensagem de e-mail conterá seus campos de formulário junto com as respostas do usuário.

Depois de personalizar suas notificações, navegue até ‘Confirmações’. Nesta seção, você configurará como exibirá a confirmação após o envio do formulário.

Primeiro, você pode escolher ‘Mensagens’, ‘Mostrar Página’ ou ‘Ir para URL (Redirecionar)’ como seu tipo de confirmação.

Se você escolher ‘Mensagem’ como seu tipo de confirmação, exibirá uma mensagem de confirmação para que os usuários saibam que você recebeu o envio do formulário deles.

Com este tipo de confirmação, você pode editar a mensagem padrão para se adequar à sua marca. Vá para o campo ‘Mensagem de Confirmação’ e digite sua mensagem personalizada na caixa de texto.

Se você escolher ‘Mostrar Página’, precisará selecionar uma página existente em seu site WordPress. E se você optar por ‘Ir para URL (Redirecionar)‘, você inserirá um URL de página.

Antes de passar para a próxima etapa, clique em ‘Salvar’ para não perder seu progresso.

Com isso feito, você está pronto para exibir seu novo formulário em seu site WordPress.

Etapa 6: Incorporando Seu Formulário no WordPress

Para exibir seu novo formulário em seu site WordPress, você pode usar o assistente ‘Incorporar’ dentro do construtor de formulários WPForms.

Isso acionará a janela pop-up ‘Incorporar em uma Página’. Nela, você pode escolher ‘Selecionar Página Existente’ ou ‘Criar Nova Página’, o que for relevante para você.

Neste exemplo, vamos com ‘Selecionar Página Existente’.

A próxima etapa é escolher a página onde você deseja exibir seu novo formulário.

Simplesmente clique no menu suspenso e escolha uma página da web existente. Depois de fazer isso, clique em ‘Vamos Lá!’.

Isso irá redirecioná-lo para o editor de blocos do WordPress.

A partir daqui, você precisa clicar no botão ‘+’ para adicionar um bloco WPForms.

Você pode digitar ‘WPForms’ na barra de pesquisa e deverá ver o bloco WPForms nos resultados da pesquisa.

Prossiga e clique para adicioná-lo.

Após adicionar o bloco WPForms, você verá um menu suspenso em sua página.

Simplesmente clique no menu suspenso e escolha um formulário da lista. Vamos selecionar ‘Formulário de Contato’, já que esse é o formulário que acabamos de criar.

Etapa 7: Publicando o Novo Formulário no Seu Site WordPress

Nesta etapa final, vamos pré-visualizar o formulário antes de publicá-lo para garantir que tudo fique perfeito. No editor de conteúdo do WordPress, clique em Visualizar » Pré-visualizar em nova aba.

Se desejar, você também pode pré-visualizar como o formulário aparece em tablets e dispositivos móveis. Tudo o que você precisa fazer é clicar em Visualizar » Tablet ou Celular » Pré-visualizar em nova aba.

Finalmente, se nenhum ajuste adicional for necessário, você pode prosseguir e clicar em ‘Atualizar’.

Parabéns! Você adicionou com sucesso seu novo formulário de contato com campos suspensos em seu site WordPress.

Veja como ficou em nosso site de demonstração:

Dica Bônus: Maneiras Criativas de Usar Campos Suspensos

Sabe o que é incrível sobre campos suspensos? Eles são muito mais versáteis do que a maioria das pessoas pensa!

Após anos construindo sites, descobrimos algumas maneiras realmente inteligentes de usar menus suspensos que vão além dos formulários de contato usuais. Aqui estão alguns de nossos casos de uso criativos favoritos para você se inspirar:

🛍️ Configuradores de Produtos – Isso permite que os usuários personalizem produtos, como ‘Escolha sua cor’, ‘Selecione o tamanho’ ou ‘Escolha um acabamento’. Isso é perfeito para páginas de produtos do WooCommerce ou formulários de pedidos personalizados.

📅 Agendamento de Compromissos – Pequenas empresas ou sites de serviços podem aproveitar os menus suspensos em cascata para horários de data e hora. Isso é especialmente ótimo para sistemas de reserva ou solicitações de consulta.

🗺️ Serviços Baseados em Localização – Você pode adicionar menus suspensos para seleção de país, estado e cidade ao incorporar mapas em seus formulários. Isso pode ser super útil para serviços de entrega ou diretórios de negócios locais.

✏️ Formulários de Quiz – Menus suspensos também são perfeitos para perguntas de múltipla escolha. Se você está administrando um curso online, então você pode usar esses campos para manter tudo organizado e arrumado!

Acima de tudo, você sempre pode personalizar e estilizar seus formulários do WordPress ainda mais, para que eles se misturem ao design do seu site.

Perguntas Frequentes: Usando Campos de Lista Suspensa em Formulários WordPress

Aqui estão as respostas para algumas das perguntas mais comuns sobre o uso de campos suspensos no WordPress.

Qual é o melhor plugin para criar formulários com campos suspensos?

Recomendamos o WPForms como a melhor opção. Suas ferramentas de IA aceleram o processo, o construtor de arrastar e soltar é super fácil de usar, e o campo suspenso está incluído até mesmo na versão gratuita WPForms Lite.

Para recursos avançados como lógica condicional, a versão WPForms Pro é uma ótima atualização.

Posso adicionar campos suspensos aos meus formulários gratuitamente?

Sim! O plugin gratuito WPForms Lite inclui o campo de menu suspenso padrão, permitindo que você crie formulários organizados e fáceis de usar sem gastar um centavo.

Os campos de menu suspenso são compatíveis com dispositivos móveis?

Definitivamente. Quando você usa um plugin de qualidade como o WPForms, todos os campos do formulário são totalmente responsivos. Isso significa que os menus suspensos se ajustam automaticamente para ter uma ótima aparência e funcionar perfeitamente em desktops, tablets e smartphones.

Posso usar imagens como opções nos campos do meu formulário?

O WPForms Pro inclui um recurso de ‘Opções de Imagem‘ para botões de rádio e caixas de seleção. Embora isso não esteja disponível para menus suspensos, ele permite que os usuários escolham entre opções visuais, perfeito para seleção de produtos e formulários semelhantes.

Recursos Adicionais: Domine Seus Formulários WordPress

Esperamos que este guia tenha ajudado você a aprender como criar formulários WordPress com campos de menu suspenso. Se você achou útil, aqui estão alguns guias selecionados para ajudá-lo a obter mais deles:

• Como Personalizar e Estilizar Seus Formulários WordPress
• Como Usar um Formulário de Contato para Aumentar Sua Lista de E-mails
• Como Bloquear Spam de Formulários de Contato no WordPress 
• Como Rastrear e Reduzir o Abandono de Formulários no WordPress
• Guia Definitivo para Usar Formulários 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.