À procura de uma forma de criar um popup lightbox para o seu site?
Um popup lightbox pode ser incrivelmente eficaz para capturar leads. Eles são projetados para convencer e converter.
Mas ter de codificar um do zero é uma verdadeira dor de cabeça. Para começar, teria de saber o suficiente de HTML, CSS e Javascript para criar o popup juntamente com regras de ativação para quando o mostrar. Depois, teria de criar uma integração manual com o seu fornecedor de serviços de email. E, finalmente, teria de lidar com quaisquer questões de privacidade e segurança.
Boas notícias: existe uma forma muito mais simples.
Neste artigo, vamos mostrar-lhe como lançar um popup lightbox sem qualquer código em menos de 10 minutos.
Vamos a isso.
O que é um Popup Lightbox?
Um popup lightbox é um formulário de adesão que aparece com um efeito cinematográfico. Quando um lightbox aparece, desfoca o resto do site em segundo plano. Desta forma, todo o seu foco está no popup.

Originalmente, o conceito de lightboxes vem da publicidade exterior:

E depois, alguns programadores acharam que este era um efeito muito fixe e criaram uma biblioteca Javascript para recriar o mesmo efeito em ativos web. Mais tarde, surgiu a ideia de usar popups lightbox.
Porque Funcionam os Popups Lightbox
Os popups lightbox capturam mais emails do que um formulário de adesão de email tradicional.
Mas porque é que funcionam?
Vamos dar uma vista de olhos rápida às principais razões pelas quais os popups lightbox funcionam tão bem.
#1. Os Popups Lightbox Apresentam uma Chamada Clara para Ação
A maioria das pessoas acredita que é ótimo dar aos seus clientes muitas opções.
Mas isso não é realmente verdade.
Se procura conversões diretas, quer uma única e clara chamada para ação em que o seu público se possa concentrar. Desta forma, remove todas as distrações da mente do utilizador. E os popups lightbox fazem um ótimo trabalho a destacar a sua oferta principal e a fazer com que as pessoas se concentrem na sua chamada para ação.
Portanto, naturalmente, as taxas de conversão são muito boas.
#2. Os Popups Lightbox São Impossíveis de Ignorar
Os popups lightbox ocupam todo o ecrã e desfocam todo o resto. Por isso, é praticamente impossível ignorá-los.
Isto é especialmente verdade se forem animados:

Claro, tem de garantir que os seus popups não são intrusivos. E pode fazê-lo personalizando quando ativar diferentes popups no seu site. Desde que o seu público não se sinta incomodado pela interrupção, pode convencê-los e convertê-los muito facilmente.
#3. Os Popups Lightbox Têm Gatilhos Personalizados
Não deve mostrar a mesma oferta a todos os seus visitantes web. Se estiver a gerir uma loja de comércio eletrónico, precisará de ofertas muito diferentes para clientes novos e recorrentes.
Para um novo cliente, pode ativar uma campanha de boas-vindas:

Mas para um cliente recorrente, pode querer enviar-lhe uma oferta diferente:

Note como os valores de desconto para ambas as ofertas são exatamente os mesmos. Mas a forma como a oferta é apresentada é drasticamente diferente. E isto é super importante porque os popups lightbox são construídos para efeitos teatrais. Por isso, uma abordagem mais personalizada trará resultados muito melhores, com certeza.
Poderia até personalizar a oferta com base nas preferências de conteúdo do seu utilizador. Se estiverem a ler um artigo sobre receitas para o jantar, faz mais sentido mostrar-lhes uma oferta relacionada com receitas para o jantar do que uma oferta de carros.

#4. Pop-ups Lightbox Podem Capturar Visitantes que Abandonam o Site
As Lightboxes são apenas um método de exibição do seu pop-up. Portanto, não há realmente nada que o impeça de personalizar o gatilho em qualquer medida que desejar. Recomendamos a criação de pop-ups lightbox de intenção de saída.

Os pop-ups de intenção de saída são acionados quando os seus visitantes tentam sair do seu site. Como resultado, retém um grande número de visitantes que, de outra forma, teriam abandonado o seu site. Portanto, se está a sofrer de abandono do site, deve definitivamente criar um pop-up lightbox de intenção de saída.
Como Criar um Pop-up Lightbox
Agora que entende o que é um pop-up lightbox e porque gostaria de criar um, como cria um pop-up lightbox? Recomendamos o uso de OptinMonster para criar os seus pop-ups.
OptinMonster é o kit de ferramentas de conversão #1 do mundo e nós usámo-lo. O OptinMonster torna super simples a criação de pop-ups poderosos que convertem. E nunca terá de usar qualquer código.
Escrevemos até uma análise completa do OptinMonster.
Pode consultá-la ou começar já com a sua campanha. Tudo o que tem de fazer é inscrever-se no OptinMonster e seguir o resto deste artigo.
Passo #1: Criar uma Campanha
Vá ao seu painel OptinMonster e clique no botão Criar:

Selecione o tipo de campanha Lightbox Popup :

Em seguida, escolha um modelo de campanha. Pode escolher qualquer modelo que desejar, mas vamos optar pelo tipo de campanha Simple para este tutorial.

Agora, dê um nome à sua campanha. Lembre-se, este nome de campanha é para si e provavelmente criará um monte destes pop-ups com diferentes opções de segmentação. Portanto, dê um nome significativo à campanha ou acabará por ficar muito confuso mais tarde.
Além disso, dependendo do seu plano, também pode usar o OptinMonster em vários sites. Portanto, selecione também o site onde deseja exibir a sua campanha.

Pressione Start Building quando terminar.
Passo #2: Editar o Seu Pop-up Lightbox
Com o OptinMonster, terá um construtor de pop-ups visual de arrastar e soltar. Assim que terminar de criar a sua campanha, poderá editar até os mais ínfimos detalhes do seu pop-up. Comece por editar o título do seu pop-up:

A parte mais incrível aqui é que basta clicar em qualquer texto que pretenda editar e alterá-lo em linha. Não há necessidade de preencher um formulário ou editar qualquer código HTML no popup.
E depois, ajuste o texto e a aparência do seu botão para criar uma chamada clara para a ação:

Quando estiver satisfeito com a aparência do seu pop-up, pode passar para configurações mais avançadas.
Passo #3: Definir Regras de Exibição
As regras de exibição destinam-se a definir quando a sua campanha aparece no seu site e quem a vê.

A nossa recomendação é que altere a condição do gatilho para intenção de saída:

Clique em Next Step para escolher a Action. Aqui, recomendamos que defina Show the campaign view para Optin View, defina o show with MonsterEffect para qualquer animação de entrada que desejar e play sound effect para qualquer efeito sonoro para o seu pop-up.

E depois, clique no botão Next Step. Pode ver a extensão total das suas configurações no separador Resumo.
Passo #4: Configurar a Sua Integração de Email
O próximo passo é configurar a sua integração de e-mail. Clique em Adicionar Nova Integração no separador Integrações e selecione o seu fornecedor de serviços de e-mail:

Recomendamos a utilização de Drip para o seu marketing por e-mail, caso ainda não tenha um fornecedor de serviços de e-mail.
Passo #5: Publicar o seu Popup Lightbox
Quando cria uma nova campanha, esta fica Pausada por defeito.
Aceda ao separador Publicar no menu superior para ver as Opções de Publicação. Em seguida, defina o estado para Publicar e selecione a plataforma do website:

Se tem um site WordPress, o plugin OptinMonster trata do resto da configuração automaticamente. O mesmo acontece para Shopify e BigCommerce. Para qualquer outro site, clique em Qualquer Site e cole o código de incorporação na secção head do seu website:

E está feito!
BÓNUS: Recolher Subscritores de Notificações Push do seu Popup
As notificações push ajudam a aumentar o tráfego do seu website e o envolvimento de forma automática. As notificações push web são uma forma eficaz de trazer de volta utilizadores que possam ter abandonado a sua sessão ou saído do website. Ajuda a re-envolver utilizadores notificando-os de novo conteúdo, ofertas ou eventos.
As notificações push também incluem mensagens claras e acionáveis e botões de chamada para ação, incentivando os utilizadores a realizar ações específicas, como ler um artigo, concluir uma compra ou participar num evento.
Pode adaptar as notificações push com base nas preferências, comportamento e interesses dos utilizadores, para garantir que as mensagens são relevantes e valiosas para cada utilizador. Os utilizadores têm de concordar em receber notificações push web. Isto garante que as mensagens não são vistas como spam e que são enviadas com a permissão dos utilizadores.
A parte mais interessante é que pode recolher subscritores de notificações push do seu popup de e-mail. Assim, caso os visitantes do seu site não queiram fornecer o seu ID de e-mail, ainda pode fazê-los subscrever utilizando notificações push web.
E é nisso que vamos trabalhar.
Passo #1: Selecionar um Serviço de Notificações Push
Recomendamos a utilização de PushEngage para enviar notificações push web.
Aqui está uma visão geral rápida do que obtém com PushEngage:
- Campanhas automatizadas de alta conversão
- Múltiplas opções de segmentação e agendamento de campanhas
- Acompanhamento de objetivos e análises avançadas
- Testes A/B inteligentes
- Um Gestor de Sucesso Dedicado
Pode começar gratuitamente, mas se estiver a levar a sério o crescimento do seu negócio, deve comprar um plano pago. Além disso, antes de comprar qualquer serviço de notificações push, deve consultar este guia sobre custos de notificações push.
E se estiver a gerir uma loja online, o PushEngage também o ajuda a aumentar as suas vendas, ajudando-o a criar notificações push automatizadas de comércio eletrónico.
Verá que o PushEngage é, sem dúvida, a melhor opção se quiser gerar tráfego, envolvimento e vendas para o seu negócio. E se tiver um orçamento limitado, pode sempre ser um pouco criativo com as suas notificações push.
Passo #2: Adicionar um Bloco HTML ao seu Popup
Primeiro, adicione um bloco HTML ao seu popup a partir da barra lateral no OptinMonster.

É aqui que vamos adicionar o código para recolher subscritores de notificações push. Primeiro, cole o seguinte código para criar um botão clicável:
<button onclick="subscribeOnClickButton()" style="border: none; width: 100%; padding-left: 15%; padding-right:15%; text-align: center; display: inline-block; color: white;">Get Updates via Push Notifications Instead</button>
Cole o código onde diz que pode adicionar HTML:

Neste ponto, deverá ver um novo botão no seu popup que diz, “Receber Atualizações por Notificações Push em Vez Disso” logo abaixo do botão de subscrição de e-mail:

Claro, pode brincar com os estilos para torná-lo mais apelativo. Em seguida, vamos fazer com que o botão recolha subscritores de notificações push quando clicado.
Passo #3: Obter Código de Subscrição do PushEngage
Aceda à página inicial do PushEngage e clique no botão Começar:

Em seguida, selecione o plano gratuito para experimentar o PushEngage ou escolha um plano pago se leva a sério o crescimento do seu negócio. Os planos pagos vêm com mais opções de campanha e a capacidade de construir listas de subscritores ainda maiores.
No seu painel do PushEngage, vá a Configurações do Site » Detalhes do Site e clique no botão Clique Aqui para Instruções de Configuração. Em Qualquer Site, obterá o seu código de instalação:

AVISO: Precisa de copiar o código que obtém do seu painel. O código é único para cada utilizador do PushEngage. Não poderá copiar o código na imagem e recolher subscritores de notificações push.
Assim que tiver o código no seu painel do PushEngage, pegue no segundo script e adicione-lhe código extra. O seu código final deverá ser algo como isto:
<script src="https://clientcdn.pushengage.com/core/02a6e92667ae2279fcba8932356c1d93.js" async></script>
<script> window._peq = window._peq || [];
function subscribeOnClickButton(){
window._peq.push(['subscribe',{}.pe,function(res){
console.log(res);
}]);
}
</script>
Passo #4: Adicionar o seu Código de Subscrição ao Bloco HTML no seu Popup
Adicione este código ao bloco HTML no OptinMonster e estará pronto!

Quando terminar, basta clicar nos botões Guardar e Publicar.
Se verificar o seu website, deverá agora ver o popup lightbox a recolher subscritores de e-mail e de notificações push:

E assim, está a recolher subscritores push do seu popup. As notificações push vêm com os seus próprios modais de popup. Mas são um pouco difíceis de personalizar. Assim, pode criar popups bonitos usando o OptinMonster e depois usá-los como os seus popups de notificação push.
O que fazer depois de criar um Popup Lightbox
É tudo por esta vez, pessoal!
Informe-nos se este artigo ajudou. Criar popups no seu site pode ajudá-lo a converter o seu tráfego em subscritores de e-mail e leads de negócio genuínos. E recomendamos vivamente que comece a criar popups lightbox imediatamente.
E se procura uma forma acessível de aumentar o seu tráfego, recomendamos o uso de notificações push. As notificações push podem ajudá-lo a gerar mais tráfego recorrente e envolvimento no site. Também pode criar campanhas de notificações push automatizadas que geram vendas.
Não está convencido? Consulte estes recursos:
- 7 Estratégias Inteligentes para Aumentar o Envolvimento do Cliente
- As Notificações Push São Eficazes? 7 Estatísticas + 3 Dicas de Especialistas
- Como Configurar Notificações Push de Carrinho Abandonado (Tutorial Fácil)
Recomendamos a utilização do PushEngage para criar as suas campanhas de notificações push. O PushEngage é o software de notificações push nº 1 do mundo. Portanto, se ainda não o fez, comece hoje mesmo com o PushEngage!

