Adicionar o chat ao seu site
Copie uma linha de código para o seu site e coloque um balão de chat em todas as páginas — ou incorpore o chat direto no conteúdo — e controle como ele aparece antes de alguém clicar.
Você vai precisar: Um web bot na sua conta e permissão para editar o HTML do seu site.
Incorporar um bot leva uma linha de código. O resto deste artigo é sobre fazer ele aparecer do jeito que você quer.
#Pegue o código de incorporação
- Vá em Bots e abra Bot Configurações. Você cai na Lista de Web Bots.
- Abra o bot que você quer, ou escolha Novo Web Bot para criar um.
- No Widget Studio, abra a aba Código de incorporação.
- Escolha Copiar para área de transferência ao lado do primeiro trecho.
Esse trecho é uma única tag <script>. Cole entre as tags <head> e </head>
de todas as páginas onde você quer o balão — ou, mais comum, na parte do
template do seu site que gera o <head> de todas as páginas de uma vez.
O balão então aparece no canto inferior direito dessas páginas.
#Incorporar o chat dentro do conteúdo
O segundo trecho da mesma aba é um <iframe>. Cole exatamente onde você quer
que o chat fique — dentro de uma página, em uma barra lateral, em uma seção
própria — em vez de flutuando no canto. Você pode mudar o width e o height.
Use o script quando quiser um balão que acompanha o leitor; use o iframe quando o chat for o conteúdo daquela parte da página.
#Em um site que o Tayon criou para você
Você nem precisa do código.
- Abra o site no editor de sites.
- Escolha o botão ⚙ e abra a aba Complementos.
- Em Web Bot, adicione o bot que você quer.
Ele entra em todas as páginas do site publicado e aparece também na pré-visualização do editor, então você consegue ver antes de publicar. Removê-lo ali tira o bot de todas as páginas de novo. Veja Publicar seu site.
#Escolha a aparência do botão de abertura
A aba Tipo decide o que os visitantes veem antes de abrir o chat.
| Tipo | Como aparece |
|---|---|
| Balão | Um botão redondo no canto. É o padrão e quase sempre a resposta certa |
| Barra de busca | Uma barra convidando a perguntar, para sites em que o chat é a principal chamada para ação |
| Vídeo | Um botão que reproduz um vídeo. Precisa de Título e URL do vídeo |
#Escolha como ele se comporta
A aba Comportamento:
- Abrir o chat automaticamente — o chat já está aberto quando a página carrega. Funciona bem em uma landing page, irrita em um blog.
- Sempre iniciar novo chat — cada visita começa uma conversa em branco em vez de retomar a última. Deixe desligado se quiser que visitantes recorrentes vejam o histórico.
- Janela ampla — um painel de chat maior.
Lembre de escolher Salvar. A Pré-visualização à direita mostra suas alterações não salvas, então você pode conferir antes de confirmar.
#Controle onde o bot pode carregar e qual fluxo roda
AutomaçãoBotsBot Acessos
Bot Acessos abre a Lista de websites. Registre um domínio aqui, adicione as páginas que te interessam e escolha qual fluxo roda em cada uma — assim sua página de preços pode abrir uma conversa diferente da sua página inicial.
Você não precisa registrar um domínio só para o widget funcionar. Registrar é como você direciona páginas diferentes para fluxos diferentes, e como você desliga um domínio se algum dia precisar impedir o bot de carregar lá.
#Desligar um bot
Cada linha da Lista de Web Bots tem um status que você pode alternar entre Ativo e Inativo.
#Se o balão não aparecer
- Confirme que o trecho está dentro do
<head>e que você está olhando uma página que realmente o inclui. Veja o código-fonte da sua página e procure portwidget.js. - Verifique se o status do bot está Ativo na Lista de Web Bots.
- Verifique se sua conta está em dia — o widget de uma conta inativa para de carregar.
- Se o balão aparece mas o chat mostra Conectando…, o motor de conversas está momentaneamente inacessível. Ele se recupera sozinho; recarregue daqui a pouco.
- Se o balão fica em cima de outra coisa no canto, troque o Tipo do botão de abertura ou mova o seu próprio elemento fixo.
Atualizado: