COMO CONFIGURAR NOTIFICAÇÕES PUSH NO WORDPRESS

Você está aqui:

Utilizar Notificações Push no WordPress é uma forma impressionante de manter seus visitantes atualizados com seus posts e novidades. Enviando mensagens diretamente do seu site WordPress para os desktops e smartphones das pessoas você pode ter certeza que sua audiência está ciente que você tem algo novo para compartilhar.

Você já percebeu as notificações usadas em sites populares como Youtube e Facebook para exibir informações importantes? Quando você lê “Notificações Push” você deve se lembrar das notificações que você recebe todos os dias no seu celular dos aplicativos como Whatsapp, Facebook, Twitter e até mesmo quando recebe um e-mail.

Quando você passa horas (ou até dias) escrevendo um novo post você quer MUITO que a sua audiência leia e devore ele no momento que você pressionar o botão de publicar. No entanto, nem sempre acontece dessa forma. Com milhares de sites lá fora competindo pelo mesmo público, pode ser difícil ter certeza que o seu conteúdo vai estar na frente da sua audiência e na mente das pessoas.

Enquanto a maioria de nós estamos familiarizados com as notificações devido a utilização em aplicativos móveis, você pode não ter percebido que elas fizeram o pulo de smartphones para os browsers e agora podem ser entregues por qualquer site. Esses pequenos lembretes podem ajudar drasticamente a aumentar o seu trafego e melhorar as conversões dos seus objetivos (capturar e-mails, aumentar vendas, adquirir cadastros, etc).

Quando as notificações push são usadas com o browser, elas são chamadas de Web Push Notifications e eu tenho certeza que você já encontrou várias delas. Quando você visita um site que envia essas notificações, o seu browser vai exibir uma mensagem para permitir as notificações.

Notificacoes Push WordPress - Mensagem

Se você permiti-las, você será notificado todas as vezes que esse website disparar uma notificação.

Você provavelmente já usa as redes sociais e talvez até envie regularmente email em forma de newsletter. Será que você realmente precisa de Notificações Push? Bem, isso depende.

Seu site pública posts e informações com uma base regular? Você quer que seus visitantes retornem ao seu site numa base diária ou programada? Se é isso que você quer, sim, você realmente precisa de notificações push.

Notificações Push são usadas para encorajar visitas a retornarem regularmente. Elas são uma maneira particularmente efetiva de manter seus usuários atualizados com o seu conteúdo e receber informações que são sensitivas ao tempo na frente dos usuários o mais rápido possível.

Vamos ser mais práticos. Aqui estão três diferentes tipos de sites que podem se beneficiar por utilizar as notificações push:

  1. Blogs que publicam conteúdo útil ou com uma base de publicações regular podem usar notificações push para alcançar sua audiencia no momento em que é publicado.
  2. Sites que regularmente publicam informações que são sensitivas ao tempo, como informações de vendas com descontos, pode alcançar seus clientes de forma programática, estratégica e rápida, na frente dos seus clientes em tempo real.
  3. Sites de notícias ou jornais que precisam manter seus leitores atualizados com notícias importantes.

O que as notificações push não podem fazer é substituir completamente um sistema de marketing como campanhas de email ou um funil de vendas. Você pode usá-las em favor de um sistema de marketing, mas não substitui-lo.

Em adição, você deve ser extremamente cauteloso para não abusar das notificações push pois são muito fáceis de enviar e alcançam todo o seu público no clicar de um botão.

Com grandes poderes vêm grandes responsabilidades (Stan Lee)

Como resultado, é recomendável que as notificações push não sejam usadas para anúncios, exibir ofertas de afiliados ou utilizar como spam. (se o seu público está a procura de cupons e descontos, essa é uma situação diferente)LISTA DE CONTEÚDOEXIBIR

Configurando Notificações Push no WordPress

Existem vários plugins e serviços que oferecem Notificações Push para WordPress, mas nós queremos aquele que tem o melhor custo x benefício. Felizmente, nesse caso, nós vamos utilizar o melhor serviço para notificações push da web, OneSignal.

A OneSignal tem o melhor plano gratuito para Notificações Push da Web com um limite de 30.000 subscribers e notificações ilimitadas. Você não vai encontrar um plano melhor que esse no mercado até o momento.

Instalação do Plugin OneSignal

Para instalar o plugin OneSignal, vá em Plugins > Adicionar Novo. Na barra de pesquisa digite “OneSignal” (sem aspas), então instale e ative o plugin.

Notificacoes Push WordPress - Instalar OneSignal Plugin WordPress

Crie sua Conta OneSignal

Preencha o formulário com suas informações ou utilize um dos botões sociais para se registrar facilmente:

Notificacoes Push WordPress - Preenchendo Dados Registro OneSignal

Lembre-se de marcar a caixa onde você concorda com os termos de serviços e política de privacidade. (I agree to OneSignal’s Terms of Service and Privacy Policy)

Depois que você preencher todos os dados, você vai precisar confirmar sua conta clicando no link de confirmação enviado para o seu email:

Notificacoes Push WordPress - Confirmacao de Email

Quando você clicar no link de confirmação em seu email, você será redirecionado para o site da OneSignal com a mensagem que seu email foi confirmado. Agora você só precisa fazer o login com os dados que você registrou no formulário de cadastro.

Quando você acessar pela primeira vez, uma tela de instruções será exibida, nós não vamos precisar dela.

Clique no botão “SKIP” no lado inferior esquerdo ou no “X” no lado superior direito para seguir com o tutorial.

Notificacoes Push WordPress - Pule Instrucao Inical

Configurando OneSignal para WordPress

Agora você já está em seu painel de configurações da OneSignal.

Para começar clique em “ADD APP“:

Notificacoes Push - Criando APP

Nome do Aplicativo

Adicione o nome do aplicativo. Normalmente é o nome do seu website ou blog, depois clique em “ADD APP“:

Notificacoes Push - Nomeando APP

Website Push

No popup de configuração de plataformas, selecione Web Push e clique no botão Next:

Notificacoes Push - Selecionando Plataforma Web Push

Escolhendo Integração

Na página de integração selecione “WordPress Plugin” e logo depois “WordPress“:

Notificacoes Push - Selecionando Integracao WordPress

Configurando Site WordPress

Nós vamos configurar a plataforma de acordo com o tipo de protocolo que você está usando em seu site.

Protocolo são esses HTTP:// ou HTTPS:// que aparecem antes da URL do seu domínio.

Sites com HTTPS (SSL):

Notificacoes Push - Configurando Dados Aplicativo
  • Em Name, coloque o nome que deseja chamar seu aplicativo.
  • Em Site URL, Coloque o endereço do seu site com o protocolo HTTPS://www.seudominio.com, como na imagem acima.
  • Em Default Notification Icon URL, adicione um link para a logo do seu site. Ela deve ter 192 x 192 de tamanho ou maior. Utilize uma URL com protocolo seguro (HTTPS) para a imagem da logo.
  • Clique no botão SAVE.

Sites com HTTP (SEM SSL):

Notificacoes Push - Configurando Site WordPress Site sem SSL
  • Em Name, coloque o nome que deseja chamar seu aplicativo.
  • Em Site URL, Coloque o endereço do seu site com o protocolo HTTP://www.seudominio.com
  • Em Default Notification Icon URL, adicione um link para a logo do seu site. Ela deve ter 192 x 192 de tamanho ou maior. Utilize uma URL com protocolo seguro (HTTPS) para a imagem da logo.
  • Selecione o botão que diz “My site is not fully HTTPS“, e adicione o nome da sua empresa ou site.
  • Clique no botão SAVE.

Configurando Plugin WordPress

Notificacoes Push - Copiando APP ID e API KEY

Nosso próximo passo é adicionar sua APP ID e API KEY nas opções do Plugin Onesignal para WordPress.

Copie a APP ID e API KEY.

Vá até o seu painel WordPress e clique em “OneSignal Push“.

Notificacoes Push WordPress - Menu Plugin WordPress OneSignal

Selecione a TAB Configuration.

Sites com HTTPS (SSL)

Notificacoes Push - Adicionando as Chaves no Plugin WordPress COM SSL2
  • MARQUE a caixa que diz “My site uses HTTPS
  • Adicione sua APP ID e API KEY
  • Role até o final da página e salve as alterações.

Sites com HTTP (SEM SSL)

Notificacoes Push - Adicionando as Chaves no Plugin WordPress SEM SSL
  • DESMARQUE a caixa que diz My site uses HTTPS
  • Adicione sua APP ID e API KEY
  • Adicione o Site Name que você escolheu
Notificacoes Push - Sitename
  • Role até o final da página e salve as alterações

Adicionando Primeiro Usuário

Notificacoes Push - Adicionando Primeiro Usuario

Agora visite a página inicial do seu site clicando no botão “GO TO MY WEBSITE“, inscreva-se em suas notificações clicando no Sino de Notificação:

Notificacoes Push - Notificacoes Ativadas

Se você conseguir se inscrever corretamente o seu aplicativo para o Google Chrome e Mozilla Firefox está configurado!

Configurando Apple Safari

Volte para o seu Painel da OneSignal e clique no Aplicativo que você criou:

Notificacoes Push - Aplicativos Criados

Nós estamos no painel de configuração do seu Aplicativo. Clique em “SETTINGS“:

Notificacoes Push - Configuracoes

Na lista de configurações, clique em “Apple Safari“:

Notificacoes Push - Selecionando Safari

Configurando Plataforma Safari

Notificacoes Push - Sitename e Site URL Safari
  • Adicione o nome do seu site (esse é o nome que os usuários vão ver)
  • Adicione o Endereço URL do seu site independente do seu protocolo
  • Clique em SAVE

Agora clique novamente nas configurações do Apple Safari:

Notificacoes Push - Selecionando Safari

agora só precisamos copiar a WEB ID para finalizarmos a configuração:

Notificacoes Push - WEB ID Safari

Agora precisamos retornar ao nosso painel WordPress e Clicar no menu “OneSignal Push”:

Notificacoes Push WordPress - Menu Plugin WordPress OneSignal

Acesse a TAB Configuration novamente:

Notificacoes Push - Adicionando WEB ID Safari Onesignal Plugin

Adicione seu WEB ID na opção do OneSignal e Salve as Alterações.

A configuração do Safari é bem mais simples, agora seu site também está configurado para suportar notificações push no Safari!

Configurando as Definições de Notificação

Estamos praticamente com tudo pronto para você começar a usar as notificações push em seu site. Mas do que adianta poder mandar as notificações se você ainda não personalizou os detalhes, certo? Se você quer aprender como definir as configurações para deixar tudo ao seu gosto, siga com o tutorial.

Sent Notification Settings

Notificacoes Push WordPress - Configuracao Definicao de Envio
  • Use the post’s featured image.. – Se você quer que a imagem destacada do seu artigo seja usada nas notificações, ative essa opção.
  • Dismiss Notification – Se o usuário não clicar na notificação, você quer que ela desapareça após 20 segundos? Se não ativar essa opção, a notificação vai ser exibida até o usuário fechar ou clicar nela.
  • Notification Title – Você deve usar o nome da sua empresa/site/blog, se desejar pode adicionar uma descrição com um separador. Exemplo: CanalWP – Guias e Tutoriais WordPress. Quando você publicar um post e enviar uma notificação, além do título do post ele exibe esse título que identifica o site que está enviando a notificação para o usuário.
  • Send Notifications Additionally.. – Essa opção permite que você envie notificações para dispositivos móveis com Android e iOS, mas é preciso realizar a configuração dessas plataformas antes de ativar essa opção.

Prompt Settings & Notify Button

Notificacoes Push WordPress - Botao Notificacao
  • Automatically prompt.. – Permite que você exiba a notificação para o visitante no momento que ele visitar seu site.
  • Enable the notify button – Ativa e exibe o botão de notificação no seu site. (esse que você pode ver no lado esquerdo do CanalWP)
  • Show the notify button after.. – Continua exibindo o botão de notificação no seu site para o usuário que está registrado.
  • Show first-time site visitors.. – Exibe uma mensagem para os visitantes que acabaram de se registrar. Para personalizar essa mensagem você precisa ativar a opção Customize the notify bell text. Procure a mensagem que diz “First-time visitor message (on notify button hover)“, cobrimos a tradução dessa parte logo abaixo.
  • Show the OneSignal Logo.. – Exibe a logomarca da OneSignal no botão de notificação do seu site. Cabe a você escolher.
  • Customize notify bell text – Permite personalizar os textos exibidos para o usuário. Por padrão eles estão em inglês, então é bom você fazer a tradução e deixar essa opção ativada. Segue um exemplo para que você entenda o que significa cada parte:
Notificacoes Push WordPress - Texto Botao Notificacao
  • Customize notify bell offset – Permite que você compense o espaço entre o botão de notificação e as bordas do seu site. Aqui no CanalWP nós deixamos o Offset padrão pois gostamos dele. Bottom aumenta o espaço da parte de baixo do botão de notificação com a borda do seu siteLeft aumenta o espaço da parte esquerda do botão de notificação com a borda do seu site. Right aumenta o espaço da parte direita do botão de notificação com a borda do seu site.
Notificacoes Push WordPress - Botao Notificacao Offset
  • Customize notify bell theme colors – Permite modificar as cores do botão de notificação para ficarem igual ao seu site.
Notificacoes Push WordPress - Botao Notificacao Cores
  • Size – Tamanho do botão de notificação que você deseja para o seu site. Pequeno, Médio ou Grande. (small, medium, large)
  • Position – Escolha onde o botão de notificação deve ficar flutuando. Canto inferior direito ou canto inferior esquerdo. (bottom right e bottom left)
  • Theme – Ele vem com dois temas que você pode usar para mudar o design do botão. Vermelho e Branco. (red e white)

Popup Settings (apenas HTTP)

Notificacoes Push WordPress - Configuracao PopUp

Essa seção permite configurar o popup que aparece para o usuário em sites com protocolo HTTP. Para quem tem HTTPS essas configurações não fazem nenhum efeito, pois a OneSignal vai utilizar a notificação nativa do browser, a mesma que exibimos aqui no CanalWP.

  • Show the OneSignal Logo – Exibe a logo da OneSignal no popup. Fica a seu critério.
  • Customize the popup text – Permite editar os textos utilizados no popup.
Notificacoes Push WordPress - Configuracao PopUp Textos2

Welcome Notification Settings

Notificacoes Push WordPress - Configuracao Boas Vindas Notificacao

Se você ativar essa opção ele vai enviar uma notificação de boas vindas para o usuário quando ele se registrar.

  • Title – Título do seu site ou nome da sua empresa
  • Message – Mensagem que você quer enviar para o usuário. Fica abaixo do título, como na imagem.
  • URL – Se o usuário clicar na notificação você quer levar ele para uma página especifica? Se sim, adicione aqui.

Automatic Notification Settings

Notificacoes Push WordPress - Notificacoes Automaticas
  • Se você ativar a 1° opção da imagem acima a caixa de enviar notificações vai estar marcada por padrão. O plugin da OneSignal adiciona uma opção que permite você escolher se quer enviar notificações ao publicar um certo post no editor de posts.
  • Se você ativar a 2° opção ele vai enviar notificações quando você publicar um post utilizando um serviço ou plugin de terceiro.

UTM Tracking Settings

Notificacoes Push WordPress - Rastreamento UTM Google Analytics

Se você deseja rastrear os dados de cada notificação (note que a onesignal disponibiliza isso no painel dela) através do Google Analytics é só adicionar sua URL UTM nessa seção. Se você não sabe como configurar parâmetros UTM pode querer dar uma olhada nesse artigo do Neil Patel sobre como usar Parâmetros UTM do Google Analytics.

Advanced Settings

Notificacoes Push WordPress - Configuracoes Avancadas

As opções avançadas são para usuários que tem necessidades personalizadas e tem conhecimento sobre o assunto. Você não precisa configurar nada aqui.

  • Additional Custom Post Types – Permite que você adicione as notificações para tipos de posts personalizados. Basta adicionar a slug ou slugs separadas por virgulas.
  • Use my own Google Project Number – Se você quer usar seu próprio projeto do Google utilize essa opção.
  • Use my own manifest.json – Se você quer utilizar seu próprio manifesto, insira-o aqui.
  • Use my own SDK.. – Se você quer utilizar seu próprio SDK utilize essa opção.

Enviando as Notificações Push

Edição de Posts

Agora que já temos a plataforma e o plugin configurados, vamos ver como enviar as notificações.

Dentro da edição de posts, acima da seção “Publicar” nós temos uma opção para enviar as notificações quando o post for publicado:

Notificacoes Push WordPress - Opcao de Envio Notificacao

Se você marcar essa caixa e publicar ou agendar o seu post, todos os assinantes receberão a notificação automaticamente.

Was this article helpful?
Dislike 0