Como criar um pop-up de tela cheia para o seu site WordPress

Publicados: 2022-08-17

Procurando uma maneira de criar um pop-up em tela cheia para o seu site WordPress?

Um pop-up de tela cheia pode ser incrivelmente eficaz para capturar leads. Eles são projetados para convencer e converter, atraindo todo o foco do visitante para si mesmo.

Mas ter que codificar um do zero é uma verdadeira dor. Por um lado, você precisa saber HTML, CSS e Javascript o suficiente para criar o pop-up junto com as regras de gatilho para quando mostrá-lo. Em seguida, você teria que criar uma integração manual com seu provedor de serviços de e-mail. E, finalmente, você teria que lidar com quaisquer problemas de privacidade e segurança.

Boas notícias: há uma maneira muito mais simples.

Neste artigo, mostraremos como iniciar um pop-up de tela cheia no WordPress com zero de codificação em menos de 10 minutos.

Vamos mergulhar.

O que é um pop-up de tela cheia no WordPress?

Um pop-up de tela cheia é um formulário opt-in que aparece com um efeito cinematográfico de tela cheia. Pense nisso como assistir a um filme no Netflix no modo de tela cheia. Quando um formulário de optin em tela cheia aparece, você não pode ver o resto do site WordPress. Dessa forma, todo o seu foco está no pop-up.

Aqui está um exemplo:

WordPress pop-up em tela cheia

Você pode usar pop-ups de tela cheia para:

  • Bem-vindo novos visitantes
  • Ofereça um cupom de desconto
  • Aponte os visitantes para o seu melhor conteúdo
  • Envie visitantes para seus perfis de mídia social

E mais. Você pode até criar formulários de contato pop-up. Os pop-ups são super flexíveis e, desde que você seja criativo, pode configurar facilmente os de alta conversão.

Como criar um pop-up de tela cheia no WordPress

Agora que você entende o que é um pop-up de tela inteira e por que deseja criar um, como criar um pop-up de tela inteira? Recomendamos usar o OptinMonster para criar todos os seus pop-ups.

OptinMonster home

O OptinMonster é o kit de ferramentas de conversão nº 1 do mundo e nós o usamos. O OptinMonster torna super simples criar pop-ups poderosos que convertem. E você nunca terá que usar qualquer codificação.

Nós até escrevemos uma revisão completa do OptinMonster.

Você pode verificar isso ou começar sua campanha agora mesmo. Tudo o que você precisa fazer é se inscrever no OptinMonster e seguir o restante deste artigo.

Etapa 1: criar uma campanha

Vá até o painel do OptinMonster e clique no botão Criar :

Criar uma nova campanha pop-up

Selecione a opção Modelo para começar a criar um optin usando um modelo pré-projetado:

Crie uma nova campanha OptinMonster

Selecione a tela cheia para começar com os modelos de pop-up de tela cheia:

Selecione o tipo de campanha em tela cheia

Em seguida, escolha um modelo de campanha. Você pode escolher qualquer modelo que desejar, mas vamos usar o modelo de campanha Recomendação de produto (Gamificado) para este tutorial.

Depois de selecionar seu modelo, dê um nome à sua campanha. Lembre-se de que esse nome de campanha é para você e você provavelmente criará vários desses pop-ups com diferentes opções de segmentação. Portanto, dê um nome significativo à campanha ou você ficará realmente confuso mais tarde.

Além disso, dependendo do seu plano, você também pode usar o OptinMonster em vários sites. Portanto, selecione também o site em que deseja exibir sua campanha.

Criar identidade da campanha

Pressione Iniciar construção quando terminar.

Etapa 2: edite seu pop-up

Com o OptinMonster, você terá um construtor visual de pop-up de arrastar e soltar. Quando terminar de criar sua campanha, você poderá editar até os menores detalhes sobre seu pop-up. Comece editando o título do pop-up:

Editar pop-up de tela cheia OptinMonster

A parte mais incrível aqui é que você apenas clica no texto que deseja editar e o altera inline. Não há necessidade de preencher um formulário ou editar qualquer código HTML no pop-up.

Você pode editar tudo o que quiser sobre o pop-up de tela cheia. Quando estiver satisfeito com a aparência do optin, você poderá passar para configurações mais avançadas.

Etapa 3: definir regras de exibição de pop-up em tela cheia

As regras de exibição destinam-se a definir quando sua campanha aparece em seu site e quem a vê.

Regras de exibição pop-up

Nossa recomendação é que você altere a condição do gatilho para exit-intent:

Pop-up da caixa de luz de intenção de saída

Clique em Próxima etapa para escolher a ação . Aqui, recomendamos que você defina Mostrar a visualização da campanha para Optin View, defina o show com MonsterEffect para qualquer animação de entrada que desejar e reproduza o efeito sonoro para qualquer efeito sonoro para seu pop-up.

Configurações de ação da campanha

E, em seguida, clique no botão Próxima etapa . Você pode ver toda a extensão de suas configurações na guia Resumo.

Etapa 4: Configure sua integração de e-mail

O próximo passo é configurar sua integração de e-mail. Clique em Adicionar nova integração na guia Integrações e selecione seu provedor de serviços de e-mail:

Integrações OptinMonster

Recomendamos usar o Drip para seu marketing por e-mail se você ainda não tiver um provedor de serviços de e-mail.

Passo #5: Publique seu pop-up de tela cheia no WordPress

Quando você cria uma nova campanha, ela é pausada por padrão.

Vá para a guia Publicar no menu superior para ver as Opções de Publicação . Em seguida, defina o status para Publicar e selecione a plataforma do site:

Publicar campanha OptinMonster

Se você estiver executando um site WordPress, o plug-in OptinMonster lida com o restante da configuração automaticamente. É o mesmo para Shopify e BigCommerce. Para qualquer outro site, clique em Qualquer Site e cole o código de incorporação na cabeça do seu site:

Incorporação global

E pronto!

O que fazer depois de criar um pop-up de tela cheia no WordPress

Isso é tudo para este, pessoal!

Deixe-nos saber se este artigo ajudou. Criar pop-ups em seu site pode ajudá-lo a converter seu tráfego em assinantes de e-mail e leads de negócios genuínos. E é altamente recomendável que você comece a criar pop-ups em tela cheia imediatamente.

E se você estiver procurando uma maneira acessível de aumentar seu tráfego, recomendamos o uso de notificações push. As notificações push podem ajudá-lo a trazer mais tráfego repetido e engajamento no site. Você também pode criar campanhas automatizadas de notificação por push que geram vendas.

Não convencido? Confira 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 usar o PushEngage para criar suas campanhas de notificação por push. PushEngage é o software de notificação push nº 1 do mundo. Portanto, se você ainda não o fez, comece a usar o PushEngage hoje mesmo!