Resumo de IA
Gostaria de adicionar seus formulários WordPress a um popup do Elementor? Se você já usa o Elementor Pro em seu site, talvez queira usar a ferramenta de popup integrada para exibir um formulário.
Em seguida, clique no botão verde Criar Template.
Neste Artigo
Requisitos: O construtor de popups do Elementor está disponível apenas com o Elementor Pro.
Se você não tem o Elementor Pro, mas ainda deseja criar um formulário popup, confira nosso guia sobre como criar um popup de formulário de contato.
Antes de começar, certifique-se de instalar e ativar o WPForms em seu site WordPress e verificar sua chave de licença.
Criando um Popup
Para criar um novo popup com o Elementor, você precisará ir em Templates » Popups na barra lateral da sua área de administração do WordPress. Em seguida, clique no botão verde Adicionar Novo Popup.
Isso abrirá uma sobreposição que permitirá nomear seu popup. Para nosso exemplo, nomearemos nosso template como Fale Conosco.
Em seguida, clique no botão verde Criar Modelo.
Incorporando seu Formulário
Em seguida, você verá outra sobreposição com a biblioteca de templates do Elementor, onde você pode escolher um template pré-fabricado para o seu popup.
Para este exemplo, clicaremos no botão X para sair da biblioteca de templates e construir nosso popup manualmente do zero.
No construtor de templates principal, pesquise os widgets na barra lateral esquerda pelo widget WPForms. Em seguida, clique e arraste-o para o construtor.
Depois de adicionar o widget WPForms ao seu popup, você pode incorporar um formulário existente nele ou criar um novo.
Incorporando um Formulário Existente
No widget WPForms do Elementor, você verá um menu suspenso onde pode selecionar o nome do formulário existente que deseja incorporar.
Se você quiser fazer alguma alteração neste formulário, pode fazê-lo diretamente do construtor de popups clicando no link Editar o formulário selecionado na barra lateral.
Isso abrirá um popup com o construtor de formulários WPForms para que você possa editar e salvar as alterações em seu formulário.
Criando um Novo Formulário
Se você quiser criar um novo formulário para o seu popup, clique no botão + Novo Formulário no painel esquerdo.
Isso abrirá um popup com o construtor de formulários WPForms, onde você pode nomear seu formulário, selecionar um template e começar a personalizá-lo.
Certifique-se de salvar seu formulário antes de fechar o construtor. Se você decidir que quer voltar e fazer alterações em seu novo formulário, clique no link Editar o formulário selecionado na barra lateral esquerda para reabrir o construtor de formulários.
Observação: Se precisar de ajuda para construir seu formulário, confira nosso guia sobre como criar seu primeiro formulário. Além disso, confira nosso template de formulário Elementor de várias páginas se você quiser usar um template de formulário pré-construído.
Personalizando Seu Formulário
Depois de adicionar um formulário ao seu popup, você também pode ajustar sua aparência para combinar com o visual do seu site na aba Estilo do construtor do Elementor.
A aba Estilo permite ajustar o estilo dos campos do formulário, rótulos e botões sem a necessidade de conhecimento em CSS.
Para saber mais, confira nosso guia sobre personalização de seus formulários.
Ativando o Envio de Formulário AJAX
Seja adicionando um formulário existente ao seu popup ou criando um novo, é uma boa ideia verificar se a submissão de formulário AJAX está habilitada. Isso evitará que seu popup feche após a submissão e que a mensagem de confirmação do formulário seja ocultada.
A submissão AJAX está habilitada por padrão para todos os novos formulários. No entanto, você pode verificar se essa opção está ativada clicando no link Editar o formulário selecionado na barra lateral do construtor de popups e indo em Configurações » Geral no construtor de formulários.
Em seguida, na seção Avançado, certifique-se de que a configuração Habilitar Submissão de Formulário AJAX esteja ativada.
Salve suas alterações antes de fechar o construtor de formulários.
Habilitando a Prevenção de Fechamento na Sobreposição
Após escolher e incorporar seu formulário, você precisará configurar uma opção para seu popup para evitar que ele feche caso inclua um campo de Upload de Arquivo ou Data/Hora.
Clique no ícone de engrenagem na barra de menu inferior do Elementor para abrir as configurações do popup. Na aba Avançado, ative a opção Evitar Fechamento na Sobreposição.
Quando terminar de configurar seu popup, clique no botão Publicar no canto inferior esquerdo da tela.
Configurando as Definições do Popup
Antes que o Elementor publique seu popup, você precisará configurar as opções de Condições, Gatilhos e Regras Avançadas. Essas opções aparecerão quando você clicar no botão Publicar no construtor de popups.
Para este exemplo, definiremos as condições para mostrar nosso popup em todo o nosso site.
Também definiremos o gatilho do popup para a configuração Ao Carregar Página.
Dessa forma, nossos usuários verão nosso popup independentemente da página que visitarem, assim que ela carregar.
Não adicionaremos regras avançadas ao nosso exemplo. Quando terminar de configurar as opções do seu popup, clique no botão Salvar e Fechar .
Observação: Se você quiser saber mais sobre o que cada configuração de popup faz, confira a documentação completa do Elementor.
Seu popup será então publicado. Você pode visitar o frontend do seu site para visualizá-lo.
Pronto! Agora você pode adicionar seu formulário do WordPress a um popup do Elementor.
Em seguida, você gostaria de aprender como capturar leads, mesmo quando os usuários não finalizam seus formulários? Certifique-se de conferir nosso guia sobre nosso addon de Abandono de Formulário.