COMO ADICIONAR UM TOP BAR AO SEU SITE WORDPRESS (E POR QUE TODOS ESTÃO FAZENDO ISSO)

Deseja aumentar suas taxas de conversão? É disso que são as barras de Olá. Se você quer adicionar assinantes de e-mail, anunciar ofertas especiais, dirigir o tráfego para uma página de destino ou fazer um anúncio em todo o site, olá, as barras realizam o trabalho.

Quais são os bares hello? Olá barras, mais genericamente chamadas barras de notificação, são as barras adicionadas à parte superior ou inferior de uma página da Web para entregar uma mensagem segmentada. Na maioria dos casos, eles são pegajosos, o que significa que eles ficam colocados enquanto você rola para cima ou para baixo. Eles geralmente entregam uma mensagem de marketing, mas seu uso não se limita ao marketing, e eles são implementados por vários sites.

As barras de notificação são populares em parte, porque elas podem ser usadas para atingir uma variedade de objetivos:

  • Execute um blog? Um boletim informativo pode fornecer um enorme impulso no tráfego repetido e uma barra de notificação pode ser usada para adicionar assinantes de e-mail.
  • Tem um anúncio de que você precisa de cada um de seus visitantes para ver? Uma barra de notificação pode exibir uma mensagem curta e um link para uma página com informações adicionais.
  • Execução de uma promoção de tempo limitado? Use uma barra de notificação para informar os visitantes sobre a oferta sensível ao tempo.
  • Contratar e pensar que os visitantes do seu site quererão saber sobre isso? As barras de notificação são uma ótima maneira de dizer “Estamos contratando!”

Configurar uma barra de hello é fácil e existem várias maneiras diferentes de adicionar um ao seu site WordPress. No entanto, antes de entrar na implementação, é importante pensar e desenvolver um plano de como você usará uma barra de notificação.

Olá Bar: Prós, Contras e Melhores Práticas

As barras de notificação podem ser incríveis. Você pode usá-los para exibir uma mensagem segmentada que atinja cada visitante. Eles não são intrusivos, mas podem ser bastante atraentes, e eles são flexíveis o suficiente para serem usados para entregar muitos tipos diferentes de mensagens.

No entanto, hello bars também pode ser ineficaz se mal implementado. Se uma barra de notificação é muito discreta, os visitantes podem ignorá-la. Popups, muito ridiculizados como irritantes, pelo menos garantem que seu visitante deve notar sua mensagem. Se a sua mensagem for urgente o suficiente para justificar a interrupção do tempo de visitas no local, um popup pode ser uma opção melhor. Além disso, as barras de notificação oferecem imóveis limitados e geralmente são apenas eficazes, fornecendo uma frase e um link muito curtos. Se você precisar exibir uma mensagem mais complexa, uma barra de notificação pode não estar na tarefa.

Com isso em mente, aqui estão três coisas que você pode fazer para garantir que o seu hello bar seja o mais eficaz possível:

  • Faça com que ele se destaque. Sério, faça o pop. Não fique louco, mas lembre-se de que uma barra de hello não está bloqueando a visão de ninguém como um pop-up, então faça com que ele realmente se destaque com cores fortes são fontes generosas.
  • Selecione o texto da barra de notificação com cuidado. Se você não é um wordsmith, encontre um. As mensagens da barra de notificação devem ser claras, sucintas e poderosas para serem efetivas.
  • Medir a eficácia e ajustar conforme necessário. Use análises para acompanhar a eficácia da sua barra de notificação. Em seguida, faça ajustes e veja o que acontece. Continue fazendo ajustes até obter resultados com os quais você está feliz.

Como outros sites usam oi Bares

Olá bares estão em toda parte na comunidade WordPress e são usados para uma variedade de propósitos. Aqui estão cinco exemplos de barras de notificação usadas em blogs e empresas populares do WordPress para que fluam seus sucos criativos.

Nós não procuramos mais além deste blog para o nosso primeiro exemplo de um hello bar. Esta barra de notificação aparece se você visitar o nosso blog sem estar logado. Se quiser vê-lo em ação, basta abrir uma janela do navegador privado ou incógnito e dar uma olhada. Depois de abrir a página, role para baixo até aparecer a barra do hello.

Há algumas coisas que você deve notar sobre este hello bar. Primeiro, usamos uma cor brilhante e texto maiúsculo em negrito para chamar a atenção para as palavras mais importantes na mensagem. Em segundo lugar, o hello bar oferece algo tangível: 14 dias de acesso gratuito e desconto contínuo. Oferecer algo tangível vai um longo caminho para aumentar a eficácia de uma barra de hello.

Captura de tela do site WPEngine

Motor WP

O WP Engine utiliza um design de cor ousada e oferece uma recompensa tangível. Esta barra de notificação é composta inteiramente de uma cor laranja corajosa, o que torna a barra inteira destacada. Ele aparece na página do blog do WP Engine e entrega uma mensagem de marketing que vende serviços do WP Engine com base em múltiplos benefícios: desconto de 20%, sites mais rápidos e conversões aprimoradas.

Pessoalmente, eu suspeito que o desempenho desta barra de notificação poderia ser melhorado. Se eu trabalhasse com o WP Engine, gostaria de realizar o teste A / B com duas modificações para ver se o desempenho da barra de notificação poderia ser melhorado.

  1. Eu reduziria e simplificaria a mensagem. Vender três recursos diferentes em uma mensagem curta é demais.
  2. Eu aumentaria o tamanho e o tamanho da fonte para que a mensagem fosse mais fácil de ler.

Minha suspeita é que esta barra de hello em particular funcionaria melhor com essas modificações, e o teste A / B poderia ser usado para identificar o texto e o design que produziram os melhores resultados.

Captura de tela do site ManageWP

ManageWP

O hello bar da ManageWP leva as coisas em uma direção inteiramente diferente.

Esta barra de notificação é um design híbrido que inclui a navegação do site aninhada na barra de notificação. Muito parecido com o hello bar da WPMU DEV, esta barra de notificação tenta vender serviços da ManageWP com uma versão de teste gratuita. No entanto, ao contrário de WPMU DEV e WP Engine, a barra de notificação ManageWP é muito subjugada e se mistura no esquema de cores e no design da página.

Como o ManageWP combinou a barra de navegação na barra de notificação, o uso de um design mais discreto faz sentido. Nesse caso, a barra de notificação existe como parte de um componente central do site e não como um widget de marketing independente. Fazê-lo saltar da página é desnecessário quando a funcionalidade do menu de navegação atrairá a atenção para a mensagem.

Captura de tela do site iThemes

IThemes

A barra de notificação iThemes é um exemplo clássico do marketing da hello bar. O design da barra de notificação faz com que ele se destaque do resto da página e a mensagem que entrega é direcionada e urgente.

Usar uma barra de notificação para entregar uma mensagem sensível ao tempo pode ser efetivo, desde que não seja exagerado. Use uma barra de notificação para exibir uma oferta “especial” ou “tempo limitado” o tempo todo, e os visitantes irão perceber que a oferta não é tão “especial” quanto você está fazendo.

Captura de tela do site WPBeginner

WP Beginner

E agora para algo completamente diferente.

A barra de notificação do WP Beginner leva as coisas a uma nova direção e promove novos conteúdos em vez de um produto ou serviço. Por que é isso? A resposta tem a ver com o fato de que o WP Beginner é um tipo de site totalmente diferente do que todos os outros que já examinamos até agora.

Quando você pensa sobre o modelo de negócios do WP Beginner, incentivar os visitantes do site a visitar outros populares, o conteúdo que induzirá o clique faz muito sentido. Ele mantém os visitantes lendo (e clicando) por mais tempo e aumentam suas chances de ganhar uma comissão ao comprar hospedagem ou um produto WordPress a partir de um link em seu site.

Olá bares ocupam imóveis privilegiados em seu site. Não use-os com cautela. Use-os para enviar mensagens importantes.

Para ser claro, não estou criticando o WP Beginner. Eu aponto isso para fazer um ponto relacionado: use uma barra de notificação para vender o que é que ganha dinheiro para sua empresa.

Isso é o que você precisa tirar desses exemplos. Em que está construído o seu negócio? Como o seu site ganha dinheiro? É o que você precisa anunciar com uma barra de notificação.

  • Você ganha dinheiro com um boletim informativo por e-mail? Anuncie sua newsletter com uma barra de notificação.
  • Você ganha dinheiro vendendo produtos ou serviços? Anuncie esses produtos e serviços com uma barra de notificação.
  • Você ganha dinheiro com links de afiliados incorporados em postagens de blog e artigos? Anuncie seu conteúdo mais desejável com uma barra de notificação.

Como fazer uma barra de Olá / Notificação

Se você deseja adicionar uma barra de notificação ao seu site WordPress, você terá algumas opções a considerar. Se você gosta de saber exatamente o que está acontecendo no código do seu site e tem algumas habilidades básicas de HTML e CSS, você poderia fazer o seu próprio. Se quiser mais funcionalidades, existem vários plugins de barra de notificação disponíveis no Diretório de Plugins do WordPress.

Existem também vários serviços de widgets de marketing de sites como o Hello Bar, o SumoMe e o GetSiteControl que se integram perfeitamente com o WordPress e oferecem barras de notificação e outros widgets de marketing de sites.

Faça o seu próprio

Captura de tela do tutorial para criar sua própria barra de alerta css
Deixe Joshua Hibbert ensiná-lo a fazer uma barra de alerta CSS puro

As barras de notificação podem ser criadas com HTML e CSS puro. Isso significa que você pode adicionar um para um site WordPress modificando apenas dois arquivos: header.php e style.css . Como sempre, antes de fazer modificações manuais em um site do WordPress, sempre crie um backup e configure um tema infantil .

Se você já é um programador de front-end competente, pode conferir agora e começar a trabalhar. No entanto, se você quer um tutorial para orientá-lo no processo de criação da barra de notificação, aqui estão duas opções a considerar:

  • Como fazer uma barra de alerta de CSS puro : um tutorial de Joshua Hibbert, pode mostrar-lhe como criar uma barra de alerta de HTML e CSS pura que está escondida ao clicar nele.
  • Pop From Top Notification : o tutorial rápido de Chris Coyier lhe dará uma maneira de exibir uma barra de notificação com compatibilidade entre navegadores que se esconda automaticamente após um intervalo de tempo predefinido.

Depois de criar a notificação, você pode adicioná-la ao seu site WordPress adicionando o CSS relevante ao arquivo style.css do seu tema e ao HTML no arquivo header.php do seu tema .

  • Olá Bar

    Screenshot do site do Hello Bar
    Hello Bar é o homônimo, após o qual todas as barras de Olá são nomeadas. Na realidade, o Hello Bar é um produto de barra de notificação, mas o Hello Bar tem sido tão bem sucedido que se tornou o nome de fato para todas as barras de notificação de estilo similar – como Klennex, Chapstick, Rollerblades e Band-Aids são todos nomes de marcas que São usados para se referir a categorias de produtos inteiras.

    Você pode obter um Hello Bar original no seu site em questão de minutos. O Hello Bar faz com que seja bobo: é fácil criar uma barra de notificação, e é fácil de usar com o WordPress.

    Você pode usar o Hello Bar para uma variedade de propósitos: coletar endereços de e-mail, fornecer um número de telefone de contato, se conectar a canais de redes sociais, exibir um anúncio ou incentivar os visitantes a visitar um link. Use o Hello Bar para o objetivo mais comum: coletar endereços de e-mail e você pode ter endereços de e-mail sincronizados com várias plataformas de marketing de e-mail populares, incluindo MailChimp, AWeber, Constant Contact e vários outros.

    O Hello Bar é gratuito para até 10 sites, mas inclui um logotipo do Hello Bar em cada barra. Para se livrar do logotipo ou criar barras para mais de 10 sites, você terá que se inscrever para uma conta premium.

  • SumoMe

    Captura de tela do site SumoMe
    O SumoMe oferece barras de notificação e muitas outras ferramentas de marketing. Para começar com o SumoMe, assine uma conta e adicione o SumoMe ao seu site WordPress. Você pode adicionar o SumoMe ao seu site de duas maneiras diferentes:

    • Adicione um breve script diretamente em  header.php ou para functions.php com a wp_enqueue_scriptfunção.
    • Com o plugin SumoMe WordPress .

    Depois de adicionar o SumoMe ao seu site, você pode criar uma barra de notificação, uma opção que o SumoMe chama de uma Barra Inteligente .

    A barra é altamente configurável. Você pode personalizar completamente a cor e a mensagem, controlar a frequência com que a barra é exibida para o mesmo visitante, integrar-se às plataformas de marketing por e-mail para coletar endereços de e-mail e muito mais.

    O SumoMe é gratuito para até 1 milhão de visualizações mensais. No entanto, se o seu tráfego exceder isso, se desejar remover a marca SumoMe ou se desejar acessar recursos premium, você precisará se inscrever para uma conta premium.

  • GetSiteControl

    Captura de tela do site GetSiteControl
    O GetSiteControl oferece a possibilidade de adicionar uma barra de notificação ou uma janela de notificação em qualquer uma das nove posições diferentes em uma página da Web.

    A notificação pode ser criada para atingir sete objetivos diferentes: adicionar assinantes, fornecer um meio de contato, anunciar uma promoção, vincular a uma pesquisa, adicionar redes sociais seguir links, adicionar links de compartilhamento de redes sociais ou adicionar um prompt de bate-papo.

    Isso é muito poder de um único serviço.

    Assim como SumoMe e Hello Bar, o GetSite Control pode ser instalado adicionando manualmente um pouco de JavaScript ao cabeçalho do site ou baixando e instalando um plugin do WordPress . O GetSiteControl é gratuito para usar com um site. No entanto, se você quiser gerenciar mais de um site a partir de uma única conta ou obter acesso a recursos avançados, como testes de A / B e pesquisas de ramificação, você precisará se inscrever para uma conta premium.

    Interessado no GetSiteControl?

  • Barra de notificação 8Degree

    Barra de notificação 8Degree para a captura de tela do plugin WordPress
    Este plugin WordPress não possui muitas instalações ativas ou uma tonelada de críticas. No entanto, é o plugin de barra de notificação de uso geral mais poderoso, gratuito que tentei.

    Após a instalação, este plugin adiciona um novo item de menu de nível superior intitulado Notification Bar para o menu admin. O plugin pode ser usado para criar uma barra de notificação por vez, e há muitas opções disponíveis. Um recurso muito bom oferecido por este plugin é a capacidade de exibir ícones de mídia social para suas contas do Facebook, Twitter, LinkedIn e Google Plus diretamente na barra de notificação.

    Outra opção inclui a capacidade de exibir a barra de notificação apenas uma vez para cada visitante e dar aos visitantes a possibilidade de descartar a barra de notificação. Você pode exibir uma mensagem HTML simples ou um formulário de ativação de e-mail. Você pode mover a barra para a parte superior ou inferior da página, ajustar a altura da barra de notificação, trocar cores e reorganizar os ícones das redes sociais em qualquer ordem.

    Se você usar a barra de notificação para exibir um formulário de opt-in de e-mail, os endereços de e-mail inscrito são salvos na página de configurações do plugin na área de administração do WordPress. A partir daí, você pode baixar todos os endereços de e-mail inscrito no formato CSV e importá-los para a plataforma de marketing por e-mail da sua escolha.

    Interessado em 8Degree Notification Bar?

  • WPFront Notificação Bar

    WPFront Notificação Bar plugin captura de tela
    Se você deseja executar scripts personalizados a partir de um botão na barra de notificação, a barra de notificação WPFront é a sua melhor opção.

    Instalar e ativar esse plugin adicionará um novo item de menu de nível superior intitulado WPFront com dois submenus. A primeira é uma tela de marketing com informações sobre todos os plugins WPFront. A segunda, Barra de notificação, fornece um menu de configurações de uma página a partir do qual você pode configurar uma barra de notificação.

    O menu de configurações inclui muitas opções, incluindo as seguintes opções:

    • Ative ou desative a barra de notificação.
    • Posicione a barra na parte superior ou inferior da página.
    • Faça a barra de notificação pegajosa para que ela permaneça no lugar como um visitante rola ou escolha exibir a barra depois que um visitante tropeçou uma certa quantidade de espaço na tela.
    • Configure a altura da barra, o estilo, o deslocamento da parte superior da tela e defina a barra para fechar automaticamente após um período de tempo definido.
    • Apenas exiba a barra de notificação para convidados ou usuários com privilégios específicos.
    • Configure uma data de início e término durante a qual a barra de notificação deve ser exibida.
    • Além disso, você pode configurar um botão na barra de notificação para abrir um link ou para executar um pouco de JavaScript personalizado.
    Interessado no WPFront Notification Bar?

  • Barras de notificação WP

    WP Notification Bars plugin screenshot
    Se você está procurando uma barra de notificação simples para exibir uma mensagem curta e um link, não procure mais.

    Após a ativação do WP Notification Bar, procure a opção de menu Barras de Notificação no menu de administração do site. A partir daí, você pode controlar as configurações básicas da barra de notificação, como cores, tamanho da fonte e largura.

    Além disso, os campos são fornecidos para inserir uma notificação de texto, texto de link e um URL de link. Algumas configurações limitadas fornecem a capacidade de limitar a exibição da barra de notificação com base nas páginas, postagens ou a página inicial estão sendo visualizadas. Finalmente, você também pode limitar a exibição da barra de notificação aos visitantes que chegam ao site do Google ou do Facebook para mensagens altamente segmentadas.

    Interessado em WP Notification Bars?

  • Barra de notificação

    Captura de tela do plugin da barra de notificação
    Se você quiser exibir uma mensagem cronometrada, com controle total sobre o estilo da barra de notificação, vale a pena considerar este plugin da WP Fruits.

    A ativação deste plugin adiciona um novo item de menu do nível superior da barra de notificação . No menu de configurações de uma página, você pode controlar se a barra de notificação é exibida na parte superior ou inferior da página da Web, bem como o número de milissegundos durante o qual a barra de notificação deve ser exibida. Outras opções incluem controle total sobre o esquema de cores e a capacidade de fornecer uma mensagem personalizada e texto de link.

    A versão gratuita deste plugin inclui um link para WP Fruits Notification Bar Pro no canto superior esquerdo da barra de notificação. Se você quiser remover esse link, você precisará comprar a versão Pro do plugin.

    Interessado em Notification Bar?

Próximos passos…

Lá está você. Oito maneiras diferentes de adicionar uma barra de notificação ao seu site do WordPress que o ajudará a alcançar seus objetivos de conversão.

Então, qual é o próximo passo?

Antes de pular para experimentar algumas dessas ferramentas, leve alguns minutos para pensar o objetivo que deseja alcançar com uma barra de notificação. O que você espera realizar?

  • Você deseja adicionar assinantes de e-mail?
  • Deseja dirigir o tráfego para uma página de destino do produto?
  • Deseja que os usuários saibam sobre um anúncio importante?

É importante saber o que deseja realizar antes de começar a tentar descobrir como fazê-lo. Defina seus objetivos de conversão e, então, aproveite o tempo para ver se uma das ferramentas que apresentamos pode ajudá-lo a realizar o que você pretende fazer.

4 (80%) 3 votes
More from William Freitas

COMO CRIAR UM ESTUDO DE CASO PERFEITO PARA ATRAIR OS MELHORES CLIENTES

Nem todos os estudos de caso são iguais. Um estudo de caso...
Read More

Deixe uma resposta

O seu endereço de e-mail não será publicado. Campos obrigatórios são marcados com *