Como Instalar Notificações Push em 3 Passos

Tempo de leitura: 5 min

Escrito por Leonardo Amoyr
em 19/03/2020

Junte-se a nós!

Participe do meu grupo do Telegram e faça parte da minha lista de ASSINANTES ELITE!

Relaxa! Detesto spam.

Compartilhe agora mesmo:

Vamos aprender como instalar notificações push no site ou no blog? É justamente isso que veremos no post de hoje!

Como instalar notificações push.
Imagem de mohamed Hassan do Pixabay.

O que são e como instalar notificações push?

Notificações push são aqueles avisos que aparecem sempre que você entra em algum site, geralmente na parte superior esquerda da tela. Veja um exemplo aqui do blog, na foto abaixo:

Exemplo de uma notificação push.
Exemplo de uma notificação push.

Como funcionam?

As notificações push funcionam como um tipo de lista de assinantes do seu site. E quando falo de site estou me referindo aos blogs também, é claro.

Basicamente, quem tem uma loja virtual (e-commerce) ou trabalha com marketing digital sabe da importância de uma lista de contatos. Geralmente essa lista é gerada através da captura de e-mails com entrega de isca digital.

Eu não sei se você reparou, mas aqui na página inicial do meu blog (www.leonardoamoyr.com) tem um campo específico pra você deixar seu e-mail e baixar o meu e-book. Quando você coloca seu e-mail lá, você passa a fazer parte da minha base de assinantes.

Em outras palavras, agora sempre que eu quiser falar com você eu posso fazer isso te enviando um e-mail, utilizando uma ferramenta de e-mail marketing.


Eu gravei dois vídeos tutoriais pro meu canal do YouTube sobre ferramentas gratuitas de e-mail marketing recentemente. Você pode conferir clicando aqui!


As notificações push funcionam mais ou menos como a captura de e-mails, só que em vez de você deixar o seu e-mail e clicar no botão para baixar sua recompensa digital, basta que você aceite receber notificações clicando no botão “Permitir” que aparece na tela do seu navegador.

Faça o teste! Acesse o meu site e veja a notificação aparecendo, como na imagem abaixo:

Exemplo de notificações push.
Outro exemplo de notificações push.

Quando você aceita receber notificações push, agora sempre que eu quiser enviar pra você uma notificação de um novo artigo que eu publiquei, basta eu enviar uma campanha para todos da minha lista de inscritos.

Você receberá um alerta na tela do seu computador ou na tela do seu celular.

Isso é possível graças à utilização de um cookie, que se instala no navegador de internet do usuário e identifica que ele deseja receber comunicações de determinado site.

Agora, vamos para a parte prática desse artigo onde eu vou te ensinar como instalar notificações push.

Como instalar as notificações push?

O serviço que irei utilizar aqui é amplamente divulgado nas comunidades digitais e possui muita qualidade. Trata-se da SendPulse, uma ferramenta de automação de marketing com recursos avançados e de fácil utilização.

Ferramenta avançada de automação de marketing.
Ferramenta avançada de automação de marketing.

Crie uma conta na SendPulse

A primeira coisa que você tem que fazer é criar uma conta na SendPulse. É rápido e gratuito para o nosso plano básico de utilização.


Clique aqui para criar sua conta na SendPulse!


Embora a gente vá utilizar o plano grátis da SendPulse, criando sua conta com o link acima garante a você R$100,00 de desconto (R$20,00 de desconto/mês, durante 5 meses) caso queira fazer o upgrade para qualquer plano pago da ferramenta posteriormente.

Painel da SendPulse.
Painel da SendPulse.

Repare que ao acessar o seu painel administrativo pela primeira vez, após ter feito o seu cadastro na ferramenta, você observa que automaticamente está inserido no plano gratuito.

Além do serviço de notificações push, a SendPulse também funciona com automação de e-mail marketing e chatbot para Facebook.

Mas, o que vamos utilizar aqui nesse tutorial é a opção “Push”, no menu superior de opções.

Configure os seus sites

Painel SendPulse.
Painel SendPulse.

Repare que eu marquei alguns detalhes importantes na foto acima. Depois de clicar em “Push”, clique em “Adicionar novo site”.

Mas, antes de seguir, repare também que eu marquei com um “*” uma caixa vermelha que revela mais um detalhe: no plano gratuito da SendPulse, você pode ter até 10 mil assinantes das suas notificações push.

Um bom número de assinantes para o plano gratuito, hein?

Painel SendPulse.
Painel SendPulse.

Note que eu marquei mais alguns detalhes para os quais você deve se atentar. Recomendo que utilize o favicon (ícone) do seu site ali na imagem do site.

Cuide para que a sua imagem não ultrapasse as dimensões propostas pela ferramenta, de 128px por 128px, com limite de tamanho de até 200 KB.

Outro ponto legal que eu customizei para todas as minhas páginas configuradas é o tempo de atraso, que deixei com 3 segundos (é o tempo até a caixinha do pedido de inscrição aparecer na tela do usuário, a partir do momento que a página é carregada pelo navegador).

Painel SendPulse.
Painel SendPulse.

Estou utilizando aqui o meu site cobaia do Curso de Barbeiro.

Agora, tudo o que você deve fazer é:

  1. Inserir o script fornecido pela SendPulse no cabeçalho do seu site, antes de fechar a marca </head>;
  2. Baixar e descompactar em seu computador os arquivos de verificação da SendPulse. Mais tarde iremos fazer o upload desses arquivos para a raiz do seu site.

Como inserir o script da SendPulse no site?

Se você utiliza um tema premium para WordPress como esse que eu estou usando agora (conheça aqui o meu tema de WordPress, o Wolf WP) ou o WP Avenger, por exemplo, isso pode ser facilmente inserido nas configurações do tema. Veja:

Códigos personalizados no Wolf WP.
Códigos personalizados no Wolf WP.
Códigos personalizados no WP Avenger.
Códigos personalizados no WP Avenger.

Mas, caso você não utilize nenhum desses dois temas, você ainda tem a opção de utilizar o plugin chamado Header Footer Code Manager, como mostra a imagem abaixo:

Plugin Header Footer Code Manager, para WordPress.
Plugin Header Footer Code Manager, para WordPress.

Após ter instalado o plugin, chegou a hora de ativa-lo e adicionar um novo snippet de código dentro do plugin.

Plugin Header Footer Code Manager, para WordPress.
Plugin Header Footer Code Manager, para WordPress.
Plugin Header Footer Code Manager, para WordPress.
Plugin Header Footer Code Manager, para WordPress.

Depois que finalizar, é só clicar no botão “Salvar” e pronto, está feito.

Como inserir os arquivos da SendPulse na raiz do site?

Para fazer isso, você deve acessar dentro do seu painel de hospedagem a opção de gerenciador de arquivos, como foi feito nas imagens abaixo:

Painel cPanel da hospedagem Gubax.
Painel cPanel da hospedagem Gubax.
Painel cPanel da hospedagem Gubax.
Painel cPanel da hospedagem Gubax.
Painel cPanel da hospedagem Gubax.
Painel cPanel da hospedagem Gubax.

É nessa etapa que você vai carregar os 2 arquivos descompactados da SendPulse clicando na opção “Carregar”, dentro do gerenciador de arquivos da sua hospedagem.


Conheça a Gubax, hospedagem barata e 100% brasileira! Use o cupom leonardoamoyr e ganhe 10% de desconto no primeiro mês de sua hospedagem, em qualquer plano.


Feito isso, é só clicar no botão “Verificar” logo no final da página e pronto! O seu site agora está configurado com notificações push corretamente!

Se você seguiu todos os passos e deu certo, meus parabéns! Agora é só compartilhar esse conteúdo para mais pessoas (tem uns botões logo abaixo onde você pode fazer isso).

Se não conseguiu, escreva um comentário logo abaixo pra mim que eu te ajudo.

Abraço e sucesso pra você!

Compartilhe agora mesmo:

Você vai gostar também:

Para enviar seu comentário, preencha os campos abaixo:

Deixe uma resposta


*


*


2 Comentários

  • Muito bom! Consegui implementar no meu Blog facilmente com o seu passo a passo. Obrigado!!

    1. Leonardo Amoyr disse:

      Wow, fantástico pessoal! =) Sucesso pra vocês.

  • Damos valor à sua privacidade

    Nós e os nossos parceiros armazenamos ou acedemos a informações dos dispositivos, tais como cookies, e processamos dados pessoais, tais como identificadores exclusivos e informações padrão enviadas pelos dispositivos, para as finalidades descritas abaixo. Poderá clicar para consentir o processamento por nossa parte e pela parte dos nossos parceiros para tais finalidades. Em alternativa, poderá clicar para recusar o consentimento, ou aceder a informações mais pormenorizadas e alterar as suas preferências antes de dar consentimento. As suas preferências serão aplicadas apenas a este website.

    Cookies estritamente necessários

    Estes cookies são necessários para que o website funcione e não podem ser desligados nos nossos sistemas. Normalmente, eles só são configurados em resposta a ações levadas a cabo por si e que correspondem a uma solicitação de serviços, tais como definir as suas preferências de privacidade, iniciar sessão ou preencher formulários. Pode configurar o seu navegador para bloquear ou alertá-lo(a) sobre esses cookies, mas algumas partes do website não funcionarão. Estes cookies não armazenam qualquer informação pessoal identificável.

    Cookies de desempenho

    Estes cookies permitem-nos contar visitas e fontes de tráfego, para que possamos medir e melhorar o desempenho do nosso website. Eles ajudam-nos a saber quais são as páginas mais e menos populares e a ver como os visitantes se movimentam pelo website. Todas as informações recolhidas por estes cookies são agregadas e, por conseguinte, anónimas. Se não permitir estes cookies, não saberemos quando visitou o nosso site.

    Cookies de funcionalidade

    Estes cookies permitem que o site forneça uma funcionalidade e personalização melhoradas. Podem ser estabelecidos por nós ou por fornecedores externos cujos serviços adicionámos às nossas páginas. Se não permitir estes cookies algumas destas funcionalidades, ou mesmo todas, podem não atuar corretamente.

    Cookies de publicidade

    Estes cookies podem ser estabelecidos através do nosso site pelos nossos parceiros de publicidade. Podem ser usados por essas empresas para construir um perfil sobre os seus interesses e mostrar-lhe anúncios relevantes em outros websites. Eles não armazenam diretamente informações pessoais, mas são baseados na identificação exclusiva do seu navegador e dispositivo de internet. Se não permitir estes cookies, terá menos publicidade direcionada.

    Visite as nossas páginas de Políticas de privacidade e Termos e condições.