Às vezes você não quer que um pop-up carregue por conta própria Você quer que ele abra apenas quando alguém clicar em um botão ou link O Construtor de pop-ups Master Addons faz isso com o Em Clique acionar e um seletor de ID CSS Você define o ID no pop-up, depois adiciona o mesmo ID a qualquer elemento Elementor e clicar nesse elemento abre o pop-up.
O que é um pop-up no clique no elementor? #
Um pop-up no clique no Elementor é um pop-up que permanece oculto até que um visitante clique em um botão específico (ou botão), link, imagem, ícone (em inglês) em vez de aparecer por conta própria quando a página carrega o Construtor de pop-ups Master Addons constrói um com o Em Clique gatilho: você dá um CSS ao pop-up Seletor ID tais como #sale-popup, então adicione esse mesmo ID (sem o #) para qualquer campo CSS do elemento Elementor. Como a correspondência é feita apenas no ID, um pop-up pode ser acionado como muitos elementos como você gosta e não precisa de licença Elementor Pro e nenhum JavaScript personalizado, embora o gatilho On Click exija Master Addons Pro. Os pop-ups no clique atendem a conteúdo orientado por intenções, como detalhes de preços, demonstrações de vídeo, formulários de login e códigos de cupom, onde um pop-up automático interromperia em vez de ajudar Navegue pelo resto do Widgets e extensões Master Addons para ver o que mais você pode colocar dentro de um.
Antes de começar #
Três coisas precisam estar no lugar antes de você configurar um pop-up no clique: um pop-up já construído no Master Addons Popup Builder, Elementor instalado e ativo e Master Addons for Elementor instalado e ativo Toda a configuração leva então dois campos e cerca de um minuto.
- Um pop-up já construído no Master Addons Popup Builder (veja o guia de configurações pop-up para criar um)
- Elementor instalado e ativo
- Complementos Mestres para Elementor instalados e ativos (guia instalação)
Passo 1: Defina o Popup para Abrir On Click #
Abra seu pop-up no Elementor e vá para o Configurações pop-up MA painel. Sob Configurações, mude Abrir pop-up para Em Clique. Um novo campo aparece: Abrir Por Seletor.
Nesse campo, digite um ID CSS com o sinal #, por exemplo #sale-popup. Esse é o seletor que aciona o pop-up Mantenha o nome simples e exclusivo para que seja fácil de reutilizar.
Passo 2: Adicione o ID CSS a um Elemento Elementor #
Agora vá para a página onde você quer o gatilho e edite-o no Elementor Escolha qualquer elemento, um botão funciona bem, e abra o seu Avançado guia. Encontre o ID CSS campo e digite o mesmo nome, mas sem o sinal # desta vez, então sale-popup.
Essa diferença faz as pessoas se animarem: o Open By Selector do pop-up usa #sale-popup, enquanto o ID CSS do elemento usa sale-popup. O # faz parte da sintaxe do seletor, não faz parte do ID.
Passo 3: Visualizar e Clique #
Atualize a página, em seguida, visualize-a no front-end Você verá seu botão (aqui está rotulado como “Click to Open Popup”) sentado no layout, sem pop-up à vista ainda.
Clique no botão, e o pop-up abre imediatamente O mesmo gatilho funciona em quantos elementos você quiser, basta dar a cada um o mesmo ID CSS.
Solução de problemas #
- Nada acontece no clique? Certifique-se de que os IDs correspondam:
#sale-popupno Open By Selector do pop-up, esale-popup(não #) no ID CSS do elemento. - Popup não está ativo? Verifique se o pop-up Ativação está ligado e suas condições de exibição incluem a página com o botão.
- Usou o # no campo ID do CSS? Remova-o O ID do CSS do Elementor leva apenas o nome simples.
Perguntas frequentes #
Como faço para abrir um pop-up Master Addons ao clicar?
No painel Configurações de popup do MA, defina Abrir popup para On Click e insira um ID CSS como #sale-popup no campo Abrir por seletor Em seguida, adicione o mesmo ID, sem o #, ao campo ID CSS de um elemento na guia Avançado do Elementor.
Por que adiciono o # em um lugar, mas não no outro?
O campo Abrir por Seletor espera um seletor CSS, e o # marca um seletor de ID. O campo ID do Elementor CSS espera apenas o nome do ID. Então você usa o #sale-popup no popup e o sale-popup no elemento.
Posso acionar o pop-up a partir de mais de um botão?
Sim. Dê a cada botão ou elemento o mesmo ID CSS, então cada um abre o mesmo pop-up no clique Você pode misturar botões, links e outros elementos.
Posso abrir um pop-up a partir de um link de texto em vez de um botão?
Sim. Qualquer elemento com o ID CSS correspondente funciona, incluindo um link, uma imagem ou um ícone Adicione o ID na guia Avançado desse elemento e ele se tornará um gatilho.
Preciso do Elementor Pro para um pop-up no clique?
Não. O Master Addons Popup Builder funciona com a versão gratuita do Elementor, portanto, o gatilho On Click e o método CSS ID funcionam sem o Elementor Pro. O próprio gatilho On Click precisa do Master Addons Pro, já que o plugin gratuito abre cada pop-up no carregamento da página.
