Web Creative - Agência de Marketing Digital

Conteúdo VIP

Que tal você receber antes de todo mundo e gratuitamente as atualizações do blog?

Widget WhatsApp Fixo na Lateral com Mensagens
Ebrahim P. LeitePor Ebrahim P. Leite18CódigosPublicado em 05/12/2017

Widget WhatsApp Fixo na Lateral com Mensagens

Coloque agora mesmo um botão do seu WhatsApp no site e ainda exiba mensagens animadas para aumentar a interatividade com seus visitantes.

  • #Compartilhe esse post
  • Compartilhar no WhatsApp
  • Compartilhar no Facebook
  • Compartilhar no Google Plus
  • Compartilhar no Twitter

Widget WhatsApp Fixo na Lateral com Mensagens

Há alguns mêses atrás, o WhatsApp lançou um link para que todos que tem website pudessem linkar o seu número e com um clique começar uma conversa. Até publicamos aqui no blog como colocar um Link para abrir o WhatsApp no seu site e tivemos muitos feedback's positivo do tutorial.

Pensando nisso, conhecemos um widget muito legal e que pode aumentar bastante a conversão do seu site ou do seu cliente. Trata-se de um widget desenvolvido pela WhatsHelp e com ele dá para criar um widget com até 10 opções de contato. Porém aqui vou ensinar a usar apenas o WhatsApp que no meu caso foi o que mais funcionou legal.

 

Adicionando um Widget Fixo do WhatsApp no site

O código é curto e objetivo. Antes da tag </body> do seu código, adicione:

<script type="text/javascript">
(function () {
var options = {
whatsapp: "+5515996838272", // Número do WhatsApp
company_logo_url: "//www.webcreative.com.br/themes/webcreative/images/perfil.jpg", // URL com o logo da empresa
greeting_message: "Olá! A primeira mensagem a ser exibida, escreva aqui.", // Texto principal
call_to_action: "Uma mensagem convidando para enviar um whatsapp.", // Chamada para ação
position: "right", // Posição do widget na página 'right' ou 'left'
};
var proto = document.location.protocol, host = "whatshelp.io", url = proto + "//static." + host;
var s = document.createElement('script'); s.type = 'text/javascript'; s.async = true; s.src = url + '/widget-send-button/js/init.js';
s.onload = function () { WhWidgetSendButton.init(host, proto, options); };
var x = document.getElementsByTagName('script')[0]; x.parentNode.insertBefore(s, x);
})();
</script>

Simples assim! Agora é só alterar os trechos em laranja para os dados da sua empresa.

Caso não consiga compreender o código acima ou tenha dificuldade em alterar, acesse o site oficial do widget onde você pode personalizar com mais facilidade e também encontrar mais opções de redes sociais.

ACESSAR WHATSHELP

Gostou dessa dica valiosa? deixe um comentário abaixo

 

  • #Compartilhe esse post
  • Compartilhar no WhatsApp
  • Compartilhar no Facebook
  • Compartilhar no Google Plus
  • Compartilhar no Twitter
Publicado por Ebrahim P. Leite

Ebrahim P. Leite

CEO & Fundador da Web Creative
Desenvolvedor Full-Stack, fundei a Web Creative em 2015, uma agência focada em criação de sites e resultados digitais.

Olá, deixe seu comentário para Widget WhatsApp Fixo na Lateral com Mensagens

Já temos 18 comentário(s). DEIXE O SEU :)
Cosme Daniel
Só que no meu não está parecendo a caixa de aviso com a logo. O que poderia ser?
★★★★★
Ebrahim P. Leite
Enviando Comentário X
Ebrahim P. Leite
Opa moquerido!

Verifica se não está dando alguma incompatibilidade no seu console. Dá uma esvaziada no cachê também pra ver se não resolve.

Abs
★★★★★
N/A
Enviando Comentário X
Cosme Daniel
Obrigado, Ajudou muito. Simples e muito prático.
★★★★★
Ebrahim P. Leite
Enviando Comentário X
Wilton Marles Nogueira
Muito bom! Só não estou conseguindo colocar a logo. É necessário colocar o https e tirar o // que está lá? pelo que entendo um pouco de html, o // é para comentários... mas no código tem um // no entre aspas.
★★★★★
Ebrahim P. Leite
Enviando Comentário X
Ebrahim P. Leite

Opa Wilton, então o // neste caso não vai comentar pois ele está entre as aspas como você disse.


Este formato de link com o //www. no começo é usado para identificar automaticamente se o link é um http ou https entendeu?


Então você pode alterar a partir da parte destacada mesmo =)

★★★★★
N/A
Enviando Comentário X
Empreendedor Web
Obrigado! muito bom
★★★★★
Ebrahim P. Leite
Enviando Comentário X
Ebrahim P. Leite
Shoow
★★★★★
N/A
Enviando Comentário X
Lázaro Monteiro
Olá, não consegui ativar no meu site do WordPress, usei um plugin de Head e Body pra adicionar o código, não deu certo.

Tem alguma outra forma de fazer funcionar?

Obrigado.
★★★★★
Seja o primeiro a curtir =)
Enviando Comentário X
Ebrahim P. Leite
Olá Lázaro,

Então eu recomendo que você instale direto no código-fonte do seu tema no WP. O código é bem simples de implementar, não precisa adicionar plugins para isso.
★★★★★
N/A
Enviando Comentário X
Luiz Bezerra
Este plugin não funciona no Firefox? ou é impressão minha?
★★★★★
Ebrahim P. Leite
Enviando Comentário X
Ebrahim P. Leite
Opa Luiz, na verdade o link de WhatsApp para Firefox até agora não é suportado pelo navegador, infelizmente.
★★★★★
Luiz Bezerra
Enviando Comentário X
Osmar Queiroz
Top muito bom.
★★★★★
Ebrahim P. Leite
Enviando Comentário X
João Victor Barreto
Muito obrigado Ebrahim, muito simples e aumenta e muito a conversão.
★★★★★
Ebrahim P. Leite
Enviando Comentário X
Ebrahim P. Leite
Fico feliz em ter ajudado João. Tmj!
★★★★★
N/A
Enviando Comentário X
Davson Santos
Show de bola a dica ....
★★★★★
Ebrahim P. Leite
Enviando Comentário X
Gilberto Martins
show Ebrahim, ótima dica!!
★★★★★
Ebrahim P. Leite
Enviando Comentário X
Willian Souza
Muito Top essa dica Ebrahim! Valeu!
★★★★★
Ebrahim P. Leite
Enviando Comentário X
Alisson Pereira Santana
Sensacional Ebrahim, parabéns!
Não imaginava que era tão simples, obrigado!
★★★★★
Ebrahim P. Leite
Enviando Comentário X
Enviando Comentário X

Área do cliente

Informe seu e-mail e senha abaixo para continuar!

{TITLE}

{CONTENT}

{TITLE}

{CONTENT}
Precisa de ajuda? Entre em contato!
0%
Aguarde, enviando solicitação!

Aguarde, enviando solicitação!