X

Como abrir um pop-up de lightbox no WordPress ao clicar

How to open a lightbox popup on click

Deseja abrir um pop-up lightbox com o clique de um botão em seu site? Os pop-ups lightbox podem ajudar a gerar leads mais direcionados e aumentar sua lista de e-mails.

Se você fizer com que o pop-up seja aberto quando o usuário clicar em um botão, poderá solicitar que ele se inscreva no seu boletim informativo, baixe um eBook ou relatório e obtenha cupons ou descontos.

Neste tutorial, mostraremos como criar facilmente pop-ups de lightbox que abrem com um clique para aumentar seus assinantes e obter mais leads.

Criando popups de lightbox do WordPress com clique da maneira correta

Os pop-ups podem ser uma excelente maneira de gerar conversões e ajudar a expandir os negócios mais rapidamente do que muitos outros métodos.

Uma das maneiras mais eficazes de exibir seu pop-up é permitir que o comportamento do usuário o acione. Por exemplo, você pode criar um pop-up que se abre ao clicar em um botão, como no exemplo abaixo:

OptinMonster popup on click in WordPress menu

Dessa forma, o usuário não é bombardeado por um pop-up, mas o vê somente quando demonstra interesse.

Esses popups funcionam bem se usados corretamente. Talvez você queira ver como o CodeinWP aumentou as conversões em 1000% usando pop-ups que aparecem em um clique.

Eles conseguiram fazer isso porque criaram uma ótima campanha que apareceu onde os usuários tinham maior probabilidade de se interessar pelo pop-up.

Eles personalizaram seus pop-ups, usaram testes de divisão para verificar o que funciona e o que não funciona, e tomaram decisões baseadas em dados. Como resultado, obtiveram grande sucesso.

A melhor parte é que criar um pop-up que abre com um clique é mais fácil do que você imagina. Não requer nem mesmo habilidades de codificação ou conhecimento técnico!

A verdade é que qualquer pessoa pode criar facilmente uma campanha pop-up bem-sucedida em poucos minutos usando o OptinMonster:

optinmonster homepage-min

O OptinMonster é, de longe, o melhor plug-in de geração de leads do mercado que facilita a criação de campanhas pop-up poderosas. E é a maneira mais fácil de criar um pop-up que aparece ao clicar em um botão.

Em resumo, o OptinMonster é sua melhor aposta para aumentar sua lista de e-mails, reduzir o abandono de carrinho e melhorar as conversões do site.

Assim como a CodeinWP, há muitas outras histórias de sucesso da OptinMonster que você pode conferir.

Agora, vamos ver exatamente como você pode criar seu próprio pop-up lightbox que abre com um clique usando o OptinMonster.

Como abrir um pop-up de lightbox ao clicar

Mostraremos a você como criar um pop-up visualmente impressionante e fazer com que ele seja aberto com um clique.

A primeira coisa que você precisa fazer é criar uma conta sem riscos no OptinMonster. Depois de se inscrever, você pode instalar o plug-in do OptinMonster em seu site para começar.

Em seguida, basta seguir as próximas etapas.

1. Crie sua campanha pop-up

Há duas maneiras de acessar o painel de controle da OptinMonster para criar campanhas. Você pode fazer login em sua conta no site da OptinMonster e criar uma nova campanha aqui:

create new campaign from the optinmonster dashboard

Você também pode visitar o painel de administração do WordPress e selecionar OptinMonster ” Dashboard para acessar o mesmo painel.

Ao abrir o painel, você verá opções para criar novos pop-ups, barras flutuantes, slides e muito mais.

Popup campaign OptinMonster

Para criar um pop-up lightbox, selecione Popup, e o OptinMonster gerará uma lista de modelos que estão prontamente disponíveis para criar sua campanha.

O OptinMonster tem mais de 100 modelos pré-criados que você pode escolher, todos com excelente aparência em dispositivos móveis, desktops e tablets.

Esses modelos economizam horas de tempo no processo de design. Mas você também tem a opção de criar uma campanha do zero com o modelo Canvas.

Hoje, usaremos o modelo Magnet para este tutorial. Ao selecionar o modelo, será exibido um prompt no qual você poderá inserir um nome para sua campanha.

Magnet template in OptinMonster

Em seguida, você será direcionado para o editor de campanhas do OptinMonster, onde poderá personalizar o modelo.

2. Crie sua campanha pop-up

O OptinMonster tem um editor visual, o que significa que você pode editar o pop-up como ele apareceria em seu site.

Você pode começar editando o título. Basta selecionar o título e as opções de edição de texto aparecerão automaticamente acima.

Edit text popup OptinMonster

Agora, você pode substituir o conteúdo por seu próprio texto, alterar a cor, o tipo e o tamanho da fonte e o alinhamento. No painel esquerdo, você também verá um editor de texto que permite alterar o estilo e a cor do plano de fundo, adicionar uma sombra de caixa e muito mais.

Da mesma forma, você também pode alterar o texto do corpo do pop-up.

Em seguida, clique na imagem da campanha. O editor de imagens aparece à esquerda, onde você pode substituir a imagem pela sua própria. Você pode escolher uma imagem da sua biblioteca de mídia ou carregar uma nova imagem do seu computador.

Da mesma forma, você pode escolher o banner roxo e alterar a cor, excluí-lo ou substituí-lo por outra imagem.

Change image in OptinMonster popup

No editor de imagens, você verá opções para alterar a opacidade da imagem, a largura, a borda e muito mais.

Depois de editar a imagem, você pode editar o botão que diz “Download my eBook”. Você pode começar selecionando o botão e o editor de botões será aberto no painel esquerdo. Aqui, você poderá alterar a cor, o texto e o estilo do botão:

Edit button OptinMonster

Por fim, vá para a guia “Success” (Sucesso) para alterar a mensagem a ser exibida aos usuários que se inscreverem. Você poderá substituir o texto e a imagem da mesma forma que fez no editor de pop-ups:

Success message in OptinMonster

Esses são apenas alguns exemplos de como você pode editar suas campanhas do OptinMonster, embora existam muitos outros. Para obter mais ajuda, talvez você queira dar uma olhada neste recurso: Como criar e projetar sua primeira campanha no OptinMonster.

Depois de personalizar o pop-up, é uma boa ideia salvar sua campanha clicando no botão “Save” (Salvar) na parte superior.

3. Defina as regras de exibição como “On Click” (Ao clicar)

Agora que sua campanha de pop-up está pronta, você pode definir uma regra para que ela apareça ao ser clicada em seu site. Para fazer isso, vá para a guia “Regras de exibição”.

Selecione MonsterLink™ (On Click) e isso criará uma regra que diz “Se o visitante clicou em um MonsterLink™”.

Display rules MonsterLink on click

Se essa opção não for exibida imediatamente, você poderá usar a barra de pesquisa no menu de regras de exibição:

click monsterlink in display rules-min

Não se esqueça de salvar suas alterações. Essa regra permitirá que você exiba o pop-up quando um usuário clicar em um link, botão ou imagem específica no seu site.

4. Adicionar um provedor de e-mail

Seu display pop-up ajuda a coletar endereços de e-mail dos visitantes para que você possa promover sua marca ou produto ou se conectar com eles por e-mail.

Por padrão, o OptinMonster usa o Monster Leads para capturar entradas de formulários pop-up. Isso significa que, quando alguém inserir o nome e o endereço de e-mail no seu pop-up, ele será automaticamente registrado no Monster Leads.

Você poderá visualizar todas essas entradas no painel do WordPress e mostraremos como fazer isso quando a campanha estiver no ar.

Você também pode integrar a campanha pop-up com seu próprio provedor de e-mail, como Constant Contact e SendInBlue.

Ao integrá-lo com seu provedor de e-mail, você pode enviar e-mails automatizados para aqueles que se inscreverem para receber seu boletim informativo ou descontos, ou que fizerem o download de seu eBook, e assim por diante.

Para integrar seu provedor de e-mail, selecione a guia “Integrações” no painel de controle do OptinMonster. Em seguida, clique no botão “Adicionar nova integração”:

add new integration with optinmonster

Em seguida, em “Email Provider” (Provedor de e-mail), você pode explorar a lista de integrações de e-mail disponíveis no menu suspenso:

Email integration OptinMonster

Depois de selecionar seu provedor de e-mail, role para baixo para adicionar notificações e tags às entradas do formulário pop-up para organizar melhor suas campanhas.

Não se esqueça de salvar suas integrações quando terminar.

5. Publique sua campanha

A próxima etapa é colocar sua campanha pop-up no ar em seu site.

Primeiro, certifique-se de salvar sua campanha e, em seguida, clique na guia “Publicar”. Aqui, você pode alterar o status da sua campanha de “Rascunho” para “Publicado”. Se não estiver pronto para lançar sua campanha, você também pode agendar uma hora e uma data para que a campanha entre no ar.

Publish campaign in OptinMonster

Você pode visualizar como a campanha ficará em seu site selecionando o botão “Preview” (Visualizar). Quando estiver satisfeito com todas as alterações, salve-as para ativar a campanha.

Para ter certeza de que sua campanha foi publicada, acesse a guia OptinMonster ” Campanhas no painel do WordPress. Se você vir que o status é “Pendente”, clique nele para obter um menu suspenso e selecione “Publicar” para tornar sua campanha ativa.

Publish status in OptinMonster

Tudo o que resta é adicionar o URL do seu pop-up a um link clicável em seu site.

6. Adicionar pop-up no clique ao seu site WordPress

O OptinMonster permite que você adicione o pop-up ao clicar em qualquer texto, botão ou menu principal.

Primeiro, você precisa copiar o MonsterLink™ que criou anteriormente. No painel de controle do OptinMonster, vá para a guia Publicado. Em “Plataformas”, você verá uma opção para obter um link compartilhável.

Copy MonsterLink

Copie esse link e mantenha-o pronto para a próxima etapa.

Agora, mostraremos como usar esse link para adicionar o pop-up no clique a um texto, botão ou até mesmo ao menu principal do seu site.

1. Adicionar MonsterLink™ a um botão e texto

Você pode adicionar facilmente o MonsterLink™ a qualquer texto ou botão no WordPress. Para fazer isso, edite a página ou postagem onde você deseja adicionar o link.

No editor de blocos, adicione um botão à sua página ou postagem clicando no sinal (+) e selecionando o bloco de botões. Depois de adicionar um botão, selecione-o para abrir o menu de configurações do bloco. Agora, clique no ícone de link para abrir o campo de link e você poderá colar o MonsterLink™ dentro dele.

Add MonsterLink to button

Da mesma forma, você pode selecionar qualquer texto em seu site, selecionar o ícone de link e colar o link para incorporar o pop-up. Quando terminar, salve ou publique sua postagem e visualize-a para ver como o pop-up funciona.

OptinMonster popup on click

2. Adicionar o MonsterLink™ a um menu do WordPress

Se quiser adicionar seu link ao menu do WordPress, acesse a guia Appearance ” Menus no painel do WordPress.

Nessa página, você pode selecionar “Links personalizados” e verá um menu suspenso que permite inserir um URL e um texto de link.

Cole o MonsterLink™ aqui dentro e adicione o texto do link de acordo com o conteúdo de sua campanha pop-up.

Add MonsterLink™ in website menu

Depois de preencher os campos, selecione o botão “Add to Menu” (Adicionar ao menu) e, em seguida, salve o menu.

Depois disso, acesse seu site do WordPress e você verá que o link para sua campanha pop-up no clique aparecerá em seu menu.

OptinMonster popup on click in WordPress menu

Agora, seu pop-up aparecerá quando um usuário clicar no texto, botão ou item de menu onde você adicionou o MonsterLink™.

Acompanhe os leads de sua campanha pop-up e otimize-os para o sucesso

O OptinMonster permite que você crie lindos popups para aumentar seus leads e expandir seus negócios, mas isso não é tudo. Ele também ajuda a acompanhar o sucesso de suas campanhas para ver o desempenho delas.

O OptinMoster usa o Monster Leads para registrar todas as entradas do formulário pop-up. Você pode encontrar a lista de entradas na guia OptinMonster ” Assinantes. Você será direcionado para a guia Leads no painel do OptinMonster.

Subscribers list with MonsterLeads

Aqui, você pode ver o nome, o endereço de e-mail e a data do assinante. Você pode usar o menu de ação para ver mais detalhes, enviar um e-mail ou excluir a entrada.

Em seguida, você pode visualizar os dados de sua campanha para ver se ela foi bem-sucedida. Para isso, você precisa abrir a guia OptinMonster ” Campaigns (Campanhas ) e verá uma lista das campanhas que criou.

Para visualizar os dados e as estatísticas de qualquer campanha, selecione o ícone de análise no menu Ações:

Analytics in OptinMonster

Aqui, você pode ver um gráfico de quantas pessoas visualizaram sua campanha pop-up e quantas se inscreveram. Você também pode verificar quais páginas ou links levam às conversões mais altas.

Dessa forma, você pode determinar onde o usuário está mais interessado no seu pop-up.

O OptinMonster também oferece a opção de integrar a campanha à sua conta do Google Analytics.

Com insights acionáveis, você pode fazer alterações em sua campanha para aumentar a taxa de sucesso das conversões.

É isso aí! Esperamos que esta postagem tenha sido útil para você. Se você gostou deste artigo, talvez também tenha interesse em:

Esses artigos estão repletos de informações para ajudar a gerar novos leads, gerar mais lucros e expandir seus negócios.

Comentários   Deixe uma resposta

Adicionar um comentário

Ficamos felizes por você ter optado por deixar um comentário. Lembre-se de que todos os comentários são moderados de acordo com nossa política de privacidade, e todos os links são nofollow. NÃO use palavras-chave no campo do nome. Vamos ter uma conversa pessoal e significativa.

WordPress Launch Checklist

A lista de verificação definitiva para o lançamento do WordPress

Compilamos todos os itens essenciais da lista de verificação para o lançamento de seu próximo site WordPress em um ebook prático.
Sim, envie-me o livro eletrônico gratuito grátis!