Neste artigo você irá aprender como criar um botão de WhatsApp e exibi-lo na sua KB, onde ao cliente clicar será direcionado para seu WhatsApp.
Passo a passo por vídeo
Siga o passo a passo a seguir:
(link comentado no vídeo https://www.convertte.com.br/gerador-link-whatsapp/ ):
Passo a passo escrito
Siga o passo a passo a seguir:
1. Adicione este código no campo "Entre as tags <head></head> do documento" de Configurações > Base de conhecimento > Aparências:
<!-- CSS Whatsapp -->
<style>
.botao-whatsapp{
width: 60px;
height: 60px;
position: fixed;
right: 25px;
bottom: 40px;
background-color: #25d366;
color: #fff;
border-radius: 50px;
text-align: center;
font-size: 40px;
box-shadow: 2px 2px 3px #999;
z-index: 100;
}
.icone-whatsapp{
margin-top: 11px;
}
</style>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.5.0/css/font-awesome.min.css">
<!-- Fim - CSS Whatsapp -->
2. Adicione este código no campo "Após abertura da tag <body>" de Configurações > Base de conhecimento > Aparências:
<!! Inicio - botão Whatsapp>
<a href="COLOQUE_SEU_LINK_AQUI"
class="botao-whatsapp" target="_blank"><i class="fa fa-whatsapp icone-whatsapp"></i></a>
<!! Fim - botão Whatsapp>
3. Gere o seu link neste site ( https://www.convertte.com.br/gerador-link-whatsapp/ )
Adicione este link no código que você adicionou em "Após abertura da tag <body>"
4. Salve a mudança e acesse a sua base de conhecimento novamente. Você verá que o ícone do Whatsapp agora este sendo exibido conforme abaixo:
