As campanhas de pop-ups, também conhecidas como mensagens no app, permitem exibir mensagens segmentadas diretamente no seu site ou app móvel para engajar visitantes no momento certo. Use-os para promover ofertas, destacar anúncios ou gerar ações sem enviar uma campanha separada. Ao contrário das campanhas push, os visitantes não precisam fazer opt-in para receber pop-ups — eles podem chegar a todo mundo.
É bom saber
- Os pop-ups usam a mesma configuração que as notificações push. Se você já configurou notificações push, não precisa configurar os pop-ups novamente. Para saber mais, confira nosso artigo dedicado Configurar notificações push Web.
- As campanhas de pop-ups são diferentes dos formulários de assinatura pop-up. Os formulários de assinatura são usados para coletar novos contatos e aumentar sua lista, enquanto os pop-up promocionais são mensagens de campanha enviadas aos visitantes do seu site ou app. Para saber mais, consulte nosso artigo Criar um formulário de assinatura pop-up na Brevo.
🔎 Etapa 1: Criar sua campanha de pop-ups
Para criar sua campanha de pop-ups:
- Vá para Marketing > Campaigns (Marketing > Campanhas).
- Clique em Create campaign (Criar campanha).
- Escolha pop-up.
- Dê um nome à sua campanha de SMS para encontrá-la facilmente na lista de suas campanhas de SMS. Esse nome só ficará visível para você.
- (Opcional) Selecione uma ou várias tags. Para saber mais, confira nosso artigo dedicado Criar e usar tags para suas campanhas e automação.
- (Opcional) Selecione uma pasta na qual você deseja salvar sua campanha de e-mail para fins de organização. Para saber mais sobre pastas de campanhas, confira nosso artigo dedicado Organize suas campanhas e modelos com pastas.
- Clique em Criar pop-up.
🎨 Etapa 3: Desenvolver seu formulário pop-up
Agora você pode começar a projetar a aparência do seu pop-up no seu site, tanto no desktop quanto em dispositivos móveis.
Você pode arrastar e soltar blocos e configurar outros elementos para criar sua campanha de pop-ups ou usar o editor de HTML/CSS.
Crie sua campanha de pop-ups
Para começar a criar sua campanha de pop-ups com o editor de arrastar e soltar:
- Clique em Create design > Drag & drop editor (Criar design > Editor de arrastar e soltar).
- Selecione Start from scratch (Começar do zero) ou escolha um dos modelos disponíveis.
-
Use o editor para adicionar conteúdo ao seu pop-up.
Expanda os seguintes acordeões para saber mais sobre os blocos disponíveis para criar seu pop-up
✏️ TextoO bloco Text (Texto) permite incluir texto descritivo no seu formulário de assinatura. Você pode adicionar uma introdução envolvente e fornecer mais contexto sobre a finalidade do formulário. Quando você clica em um bloco de texto, uma barra superior é exibida. Essa barra permite modificar a formatação do texto (como estilo, fonte, tamanho, cor e alinhamento) e inserir links.
🖼️ ImagemO bloco Image (Imagem) permite adicionar uma imagem envolvente. Você pode selecionar ou gerar uma imagem. Você pode adicionar uma página ou tela de destino e personalizar o estilo da imagem. 🖱️ Button (Botão)O bloco Button (Botão) permite que você adicione uma chamada para ação ao adicionar uma URL, o que permite que os visitantes sejam redirecionados quando a clicarem. Você pode personalizar o estilo do botão de chamada para ação: alterar o texto, a cor, a fonte, o raio da borda e o preenchimento. -
Você pode personalizar a aparência do seu pop-up no seu site. Clique em cada elemento da pré-visualização para editá-lo. Personalize o design do seu pop-up usando o painel de configuração. Expanda os seguintes acordeões para saber mais sobre quais elementos do pop-up você pode personalizar.
🔳 Sobreposição de plano de fundoClique na sobreposição de plano de fundo na visualização para personalizá-la. Você pode escolher uma cor e a opacidade para o plano de fundo para destacar a janela pop-up. 💬 Janela pop-up (layout, imagem, estilo)Clique na janela pop-up na pré-visualização para personalizar o design dela:
- Position & size (Posição e tamanho): defina a posição e o tamanho do pop-up.
- Layout: ajuste o espaçamento, as margens, a distância da borda da página e a orientação.
- Image (Imagem): Ative a opção Show image (Mostrar imagem) para exibir uma imagem no seu pop-up. Clique em Select image (Selecionar imagem) para fazer upload de uma imagem ou em Generate (Gerar) para criar uma com IA.
- Style (Estilo): personalize a cor de fundo, as bordas, os cantos arredondados e a sombra.
- Animation (Animação): escolha como o pop-up aparece e desaparece.
- Automatic closure (Fechamento automático): ative o fechamento automático do pop-up.
💡 É bom saberA seção Image (Imagem) permite que você adicione uma imagem apenas no pop-up. Para adicionar mais imagens ou colocá-las em outro lugar, use o bloco Image (Imagem) em vez disso. Observe que esta imagem não é clicável, ao contrário do bloco Image (Imagem).✖️ Botão Close (Fechar)Clique no botão de fechar para editar a cor do ícone em formato de X, a cor de preenchimento, as bordas e o sombreamento.
Para começar a criar sua campanha de pop-ups com o editor HTML/CSS:
- Clique em Create design > HTML/CSS editor (Criar design > Editor HTML/CSS).
- Escreva seu código HTML e CSS diretamente no editor para ter controle total sobre o design do seu pop-up.
- Clique em Save and exit (Salvar e sair) quando terminar.
Visualização móvel
| Você pode pré-visualizar a aparência do pop-up em um dispositivo móvel alternando a pré-visualização de desktop para móvel na parte superior do editor. Observe que você não pode editar a visualização móvel. |
Quando estiver satisfeito com a aparência dos seus pop-ups, clique em Save and exit (Salvar e sair).
⚙️ Etapa 3: Configurar sua campanha de pop-ups
Expanda os seguintes acordeões para ver as opções disponíveis para configurar seu formulário pop-up.
- Selecione em qual plataforma você deseja que o pop-up seja exibido. Para configurar sites, consulte nossa seção dedicada neste artigo.
- Escolha as páginas em que os visitantes verão o pop-up no seu site:
-
Show on all pages (Mostrar em todas as páginas)
Seu formulário pop-up pode aparecer em todas as páginas do site. -
Show on these pages only (Mostrar apenas nessas páginas)
Insira o URL das páginas em que você quer que o pop-up apareça. Você pode adicionar até 20 URLs. -
Show on all pages except these ones (Mostrar em todas as páginas exceto essas)
Insira o URL das páginas em que você não quer que o pop-up apareça. Você pode adicionar até 20 URLs.
-
Show on all pages (Mostrar em todas as páginas)
- Clique em Save (Salvar).
- Escolha quando os visitantes verão o pop-up no site.
-
Quando a página/tela carregar
Selecione o atraso em segundos. -
Quando o usuário estiver prestes a sair da página
O formulário pop-up aparecerá quando o usuário estiver prestes a sair da página: ao entrar fechar a guia da página, inserindo uma nova URL ou movendo o mouse para fora da página. -
Quando um evento ocorrer
O pop-up aparece quando um evento personalizado que você definiu é acionado.
-
Quando a página/tela carregar
- Selecione quantas visitas antes de o pop-up aparecer para um visitante.
- Selecione quantas vezes um visitante pode ver o mesmo formulário pop-up.
- (Opcional) Se um visitante pode ver o mesmo formulário pop-up pelo menos duas vezes, selecione o atraso antes que um visitante veja esse formulário pop-up novamente.
- Clique em Save (Salvar).
🚀 Etapa 5: Ativar seu formulário pop-up
Agora você pode ativar seu pop-up:
- Revise a configuração do seu pop-up.
- Clique em Activate now or later (Ativar agora ou mais tarde).
- No menu suspenso Activate pop-up (Ativar pop-up), selecione:
- Now (Agora) para publicar seu pop-up imediatamente, ou
- At a specific time (Em um horário específico) para selecionar um dia e um horário de ativação.
- No menu suspenso Deactivate pop-up (Desativar pop-up), selecione:
- Never (Nunca) para manter seu pop-up ativo, ou
- At a specific time (Em um horário específico) para selecionar um dia e um horário de desativação.
- Clique em Activate now (Ativar agora) ou Schedule pop-up (Agendar pop-up).
Quando seu pop-up estiver no ar, você poderá acompanhar seu desempenho na página Campaigns (Campanhas): visualizações, cliques e taxa de conversão.
⏭️ O que vem a seguir?
🤔 Dúvidas?
Em caso de dúvida, sinta-se à vontade para entrar em contato com nossa equipe de suporte, criando um tíquete a partir da sua conta. Caso ainda não tenha uma conta, entre em contato conosco aqui.
Se você está procurando ajuda com um projeto usando o Brevo, podemos encontrar à agência parceira da Brevo certa.