Adicionando popup no site

Popup no WordPress: adicione usando o plugin SUMOME

Oi, Oi! Se você está pensando em adicionar um popup no seu site, este artigo foi escrito especialmente para você! 🙂

[ATUALIZADO EM 05/10/2016: Na versão gratuita do SUMOME não é mais possível fazer integração direta com o MAILCHIMP. Em breve vou indicar um novo plugin que faz isso com integração direta.]

Mas antes de mostrar como adicionar um popup no WordPress utilizando o plugin SUMOME, vamos entender um pouquinho algumas coisas:

Mari, afinal, o que é um POPUP?

Essa é fácil: um PopUp nada mais é do que uma “caixinha” que é aberta automaticamente quando o visitante acessa a página inicial (ou qualquer outra página) do seu site. O objetivo dessa “caixinha” é “chamar o usuário para uma ação”, seja ela conhecer alguma outra página (ou produto) ou cadastrar-se.

Os popups, apesar de serem muito polêmicos, são responsáveis por muitos cadastros em um site.

Até por essa polêmica, já existem vários plugins que permitem que você configure o tempo, em segundos, que esse popup deve levar para aparecer pela primeira vez ao usuário e, também, em quanto tempo depois da primeira “aparição” (rsrs) ele deverá aparecer novamente. Embora sejam simples, essas configurações ajudam a torná-lo menos “invasivo” e “chato” para os usuários que visitam sempre o seu site.

Ah, entendi. E o que é o SumoMe?

O SUMOME nada mais é do que um plugin para o WordPress.Org. Ele nos proporciona o acesso a várias ferramentas (gratuitas e pagas) que nos ajudam a potencializar o nosso site, facilitando o cadastro em listas de e-mail marketing, compartilhamento de artigos, otimização, entre outros.

Já saquei! E agora, como adicionar um popup no WordPress?

Agora que você já sabe o que é um popup e o que é o SUMOME, vamos aos passos para configurar o Popup no WordPress.

Instale e ative o plugin SumoMe

O primeiro passo é procurar o plugin no repositório do WordPress, instalar e ativar.

PopUp no WordPress com o SumoMe

Cadastre-se no SumoMe

Logo após a instalação, vai parecer que não aconteceu nada, rsrs, mas aconteceu! O SumoMe passa a aparecer na lateral direita do seu site, em um retangulozinho azul. Vê só:

Sumome Escondido

Basta clicar aí que vai aparecer uma janelinha para você se cadastrar. Informe o seu e-mail e uma senha e pronto!

Sumome Cadastro

Escolha o aplicativo que vai usar

Após instalar, precisamos informar ao SumoMe qual (ou quais) aplicativos dele iremos utilizar. É como se comprássemos o aplicativo, mas, no caso do popup, é gratuito! 🙂

Sempre que aparecer a janelinha do SumoMe, é só clicar no retângulozinho azul na lateral direita e depois na coroa que aparece para exibir os aplicativos que você já tem instalado e o link da loja para instalar novos.

Após clicar na coroa, clique em SumoStore: vão aparecer todos os aplicativos disponíveis para instalação. Basta clicar em ListBuilder e depois no botão “FREE” para fazer a instalação do ListBuilder no seu site.

Sumome ListBuilder

Sumome ListBuilder 02

Prontinho! Aplicativo instalado!

Aparecerá uma mensagem na tela e o botão “FREE” será substituído por um “OPEN”. Clique nele para iniciar as configurações 🙂

Use a versão gratuita!

Após clicar no botão “OPEN”, a primeira telinha pode te oferecer para “atualizar” seu plano por um pago. Não se preocupe: basta informar que quer continuar com a opção gratuita e pronto! 😉

Sumome Gratis

Configurando o seu popup no Wordpress

A primeira janela de configuração, apenas mostra quantos e-mails o seu pop-up no WordPress já capturou. São as estatísticas do seu plugin. Sempre que quiser analisá-las, acesse novamente essa janela. No nosso caso, como estamos instalando do zero, as estatísticas aparecerão zeradas.

ListBuilder Status

Vamos para o Design

Ao clicar na guia “Design”, vamos configurar o design do nosso popup no WordPress. Na versão gratuita, só podemos escolher o template padrão (default), o que nos dará poucas opções de personalização. Mas não fique triste: são opções suficientes para deixá-lo com uma carinha bem parecida com o nosso tema visual.

ListBuilder Design

Escolha o tamanho do popup (size), informe o título (heading), sua fonte e cor. Informe também o texto, sua cor e fonte e, por último, o texto do botão, sua cor de fundo e cor da fonte.

ListBuilder Design 02

É legal você informar também o placeholder do campo e-mail (aquela frase que vai dentro da caixinha de texto do e-mail, que fica clarinha e some quando você digita), configurar a mensagem que será exibida em caso de sucesso e o botão pra pessoa continuar. Você pode definir a cor de fundo do popup também.

Feito tudo isso, clique no botão SALVAR do canto superior direito 🙂

Que campos posso capturar?

Na versão gratuita do Sumome, você só pode capturar o campo EMAIL, fazendo integração direta com o MailChimp e alguns outros servidores de e-mail marketing. Há a possibilidade de fazer a integração manual (com o código do formulário), mas só recomendo para quem conhece HTML e CSS, pois terá que fazer toda a personalização do design do formulário manualmente, “na unha”.

Configurando a frequência de exibição do seu popup no WordPress

Na aba “Behavior” vamos configurar a frequência de exibição do nosso popup para cada visitante. Ao informar a frequência, o popup não será exibido para o mesmo visitante até que o tempo que você configurou passe, por exemplo: se configurar 1 month, depois da primeira exibição, só vai exibir depois de 1 mês novamente…

ListBuilder Frequencia

Clique em SALVAR e bora para o próximo passo.

PS: Se você configurou corretamente o seu formulário no MailChimp, não se preocupe em preencher o “Success Redirect URL”. Caso contrário, essa é a URL que o usuário será direcionado após se cadastrar (por exemplo, uma página de próximos passos).

É hora da integração!

Agora vamos integrar o popup com o seu servidor de e-mail marketing. Para isso, clique na aba “SERVICES”.

ListBuilder Servicos

Clique no seu servidor de e-mails (vou continuar com o MailChimp) e depois em CONNECT.

Informe seu nome de usuário e senha do MailChimp e clique em LogIn.

ListBuilder MailChimp

Voltando à tela anterior, serão carregadas todas as suas listas no campo MailingList. Selecione a lista que armazenará os usuários capturados no popup e clique em SAVE.

ListBuilder Lista

PS: Caso queira desabilitar o Double Opt-in é só clicar no campo “Disable Double Opt-in”.

Prontinho! PopUp configurado! Basta testar 🙂

Para isso, abra uma nova janela do seu site e em alguns segundos o popup aparecerá. Mas atenção: ele só aparece a primeira vez. Depois disso, só depois do tempo que você configurou lá em “Frequência”. Se quiser ver novamente, uma opção é abrir uma guia anônima no seu navegador 🙂

Para finalizar…

Seguindo todos esses passos, em menos de 3o minutos você já terá instalado um popup no WordPress. Legal né?

Agora me conta: conseguiu configurar o popup no seu site? Foi tranquilo? Compartilha sua experiência com a gente! Deixa um comentário aqui embaixo e eu vou adorar responder! Se preferir, mande e-mail para: mari@mundodama.com.br 🙂

Ah! E se achar que esse artigo pode ser útil para mais pessoas: compartilhe!

Um beijo e até a próxima!

Curtiu? Então nos ajude a espalhar esta mensagem por aí!



  • ariana

    Olá

    Estou tendo problema na configuração do Sumome, mesmo aplicativos Free ele pede cartão de crédito mas quando informo aparece cartao inválido.

    Aconteceu isso com vc?

    • Mariana Camargo

      Olá, Ariana! Tudo bem?
      Ixi, nunca tive esse problema lá. Quando clico na opção “FREE” ele já deixa eu continuar… manda um print da tela para eu dar uma olhada: mari@mundodama.com.br

      Um beijo.

  • Elizete Colombo

    oiii, não consegui fazer a integração com o mailchimp ele dá a mensagem “MailChimp is a SumoMe Pro feature. To enable exporting to MailChimp please upgrade to SumoMe Pro.”

    • Mariana Camargo

      Boa noite, Elizete!
      Acabei de atualizar o post. Infelizmente, nas versões mais recentes o SUMOME retirou a integração direta com o Mailchimp da versão gratuita 🙁
      Você pode tentar utilizar a forma de CUSTOM HTML FORM, colando o seu formulário do mailchimp lá…
      Em breve vou criar um novo post indicando um novo plugin para fazer isso 🙂
      Beijo!

  • Mariana Camargo

    Oi, Silvia!
    Aí teria que ser um popup específico. Chama-se “Exit popup”
    Vou escrever em breve um artigo sobre isso também!
    Um beijo!

  • Dayse Cristina Magalhães

    Bom dia, Mariana.
    Também não consegui fazer a integração com mailchimp e além disso, apesar de ter configurado somente um popup para aparecer quando o usuário for sair da tela, ele mostra mais dois popups que alimentam a lista de contados do SUMOME, você saberia me informar se essa também é uma restrição da versão free?

    • Mariana Camargo

      Boa tarde, Dayse!
      Pelo que vi o SUMOME não tem o exit popup na versão free… será que não estão ativados dois popups aí no seu? De plugins diferentes? 🙂