[Guia para desenvolvedores] Personalize o comportamento do Widget
CRIADO
por
Calebe Ribeiro
Com a API do Widget (Huggy Chat), você pode definir comportamentos personalizados para o chat em suas páginas.
Neste artigo, confere alguns exemplos de código que modificam o padrão do chat para abrir automaticamente ao carregar a página, após alguns instantes e ao clicar em um botão.
Confira o vídeo:
Códigos
Abaixo você tem acesso os códigos mostrados no vídeo, para abrir o chat:
Ao acessar o site
Para abrir o chat automaticamente ao carregar a página, basta adicionar esta linha ao código do seu Widget:
afterLoad: () => Huggy.openBox()
<script>var $_Huggy = { defaultCountry: '+55',
uuid: '0b8abfea-a42d-4fb2-a82a-' ,
company: '12345',
afterLoad: () => Huggy.openBox()
};
// ... (restante do código)
</script>
O evento afterLoad permite executar funções após o carregamento do Widget. Já o método Huggy.openBox() faz a abertura da caixa do chat.
Após um intervalo de tempo
Se você deseja que um intervalo de tempo seja dado até que a caixa do chat se abra, utilize a função setTimeout e defina o tempo desejado em milissegundos.
afterLoad: () => setTimeout(()=> Huggy.openBox(), 5000)
<script>var $_Huggy = { defaultCountry: '+55',
uuid: '0b8abfea-a42d-4fb2-a82a-' ,
company: '12345',
afterLoad: () => setTimeout(()=> Huggy.openBox(), 5000)
// ... (restante do código)
};
</script>Ao clicar em um botão
Caso sua necessidade seja abrir o chat ao clicar em um botão da página, adicione onclick ="Huggy.openBox()" na tag <button>.
<button onclick ="Huggy.openBox()">Comprar</button>
Você pode utilizar o mesmo princípio em outros elementos html.
