Resumo de IA
Gostaria de adicionar os seus formulários WordPress a um popup do Elementor? Se já estiver a executar o Elementor Pro no seu site, poderá querer usar a sua ferramenta de popup integrada para exibir um formulário.
Este tutorial irá mostrar-lhe como configurar e usar um popup do Elementor com o WPForms.
Neste Artigo
Requisitos: O construtor de popups do Elementor está disponível apenas com o Elementor Pro.
Se não tiver o Elementor Pro mas ainda assim quiser criar um formulário popup, consulte o nosso guia sobre como criar um popup de formulário de contacto.
Antes de começar, certifique-se de que instala e ativa o WPForms no seu site WordPress e verifica a sua chave de licença.
Criar um Popup
Para criar um novo popup com o Elementor, terá de ir a Templates » Popups na barra lateral da sua área de administração WordPress. Em seguida, clique no botão verde Adicionar Novo Popup.
Isto abrirá uma sobreposição que lhe permitirá nomear o seu popup. Para o nosso exemplo, chamaremos ao nosso modelo Contacte-nos.
Em seguida, clique no botão verde Criar Modelo.
Incorporar o seu Formulário
Em seguida, verá outra sobreposição com a biblioteca de modelos do Elementor, onde pode escolher um modelo pré-feito para o seu popup.
Para este exemplo, clicaremos no botão X para sair da biblioteca de modelos e construir manualmente o nosso popup do zero.
A partir do construtor de modelos principal, procure 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, pode incorporar um formulário existente ou criar um novo.
Incorporar um Formulário Existente
No widget WPForms do Elementor, verá um menu suspenso onde pode selecionar o nome do formulário existente que gostaria de incorporar.
Se quiser fazer alguma alteração a este formulário, pode fazê-lo diretamente a partir do construtor de popups clicando na ligação Editar o formulário selecionado na barra lateral.
Isto abrirá um popup com o construtor de formulários WPForms para que possa editar e guardar as alterações ao seu formulário.
Criar um Novo Formulário
Se quiser criar um novo formulário para o seu popup, clique no botão + Novo Formulário no painel esquerdo.
Isto abrirá um popup com o construtor de formulários WPForms, onde pode nomear o seu formulário, selecionar um modelo e começar a personalizá-lo.
Certifique-se de que guarda o seu formulário antes de fechar o construtor. Se decidir que quer voltar e fazer alterações ao seu novo formulário, clique na ligação Editar o formulário selecionado na barra lateral esquerda para reabrir o construtor de formulários.
Nota: Se precisar de ajuda para criar o seu formulário, consulte o nosso guia sobre como criar o seu primeiro formulário. Consulte também o nosso modelo de formulário Elementor de várias páginas se quiser usar um modelo de formulário pré-construído.
Personalizar o Seu Formulário
Depois de adicionar um formulário ao seu popup, pode também ajustar a sua aparência para corresponder ao aspeto do seu site no separador Estilo do editor do Elementor.
O separador Estilo permite ajustar o estilo dos campos do formulário, rótulos e botões sem necessidade de conhecimentos de CSS.
Para saber mais, consulte o nosso guia sobre personalização dos seus formulários.
Ativar o Envio de Formulário AJAX
Quer adicione um formulário existente ao seu popup ou crie um novo, é uma boa ideia verificar se a submissão de formulário AJAX está ativada. Isto impedirá que o seu popup feche após a submissão e que oculte a mensagem de confirmação do formulário.
A submissão AJAX está ativada por defeito para todos os novos formulários. No entanto, pode verificar se esta opção está ativada clicando na ligação Editar o formulário selecionado na barra lateral do editor de popups e indo para Definições » Geral no editor de formulários.
Em seguida, na secção Avançadas, certifique-se de que a definição Ativar Submissão de Formulário AJAX está ativada.
Guarde as suas alterações antes de fechar o editor de formulários.
Ativar a Prevenção de Fecho na Sobreposição
Depois de escolher e incorporar o seu formulário, terá de configurar uma opção para o seu popup para evitar que o formulário feche se incluir um campo de Carregamento de Ficheiro ou Data/Hora.
Clique no ícone de engrenagem na barra de menu inferior do Elementor para abrir as definições do popup. No separador Avançadas, ative a opção Evitar Fecho na Sobreposição.
Quando terminar de configurar o seu popup, clique no botão Publicar no canto inferior esquerdo do ecrã.
Configurar as Definições do Popup
Antes de o Elementor publicar o seu popup, terá de configurar as definições de Condições, Gatilhos e Regras Avançadas. Estas opções aparecerão quando clicar no botão Publicar no editor de popups.
Para este exemplo, definiremos as condições para mostrar o nosso popup em todo o nosso site.
Também definiremos o gatilho do popup para a definição Ao Carregar Página.
Desta forma, os nossos utilizadores verão o nosso popup independentemente da página que visitarem, assim que esta carregar.
Não adicionaremos quaisquer regras avançadas ao nosso exemplo. Assim que terminar de configurar as definições do seu popup, clique no botão Guardar e Fechar .
Nota: Se desejar saber mais sobre o que cada definição de popup faz, consulte a documentação completa do Elementor.
O seu popup será então publicado. Pode visitar o frontend do seu site para o ver.
É tudo! Agora pode adicionar o seu formulário WordPress a um popup do Elementor.
Em seguida, gostaria de saber como capturar leads, mesmo quando os utilizadores não concluem os seus formulários? Certifique-se de consultar o nosso guia sobre o nosso addon de Abandono de Formulário.