Pergunta
Quero modificar o comportamento nativo do Web Widget (clássico) com APIs JavaScript. Eu li a Central de Ajuda e encontrei muitas implementações diferentes. Como posso combinar esses fluxos de trabalho da API do Web Widget (clássico)?
Resposta
Aplique as configurações do widget no momento certo. Alguns fluxos de trabalho precisam ser executados após uma atualização do departamento e outros precisam ser executados quando o widget se conecta ou reconecta pela primeira vez. Isso é importante porque o widget pode carregar antes de uma sessão de chat existir e um visitante pode se reconectar após um tempo limite de sessão ou atualização da página. Se o código for executado apenas uma vez no carregamento da página, a sessão de chat ativa pode perder algumas configurações ou o widget pode perdê-las após uma reconfiguração.
Este exemplo mostra como configurar o departamento CRM. Neste exemplo, "CRM" é o nome de um departamento do Chat que você configura nas configurações do widget do Chat (por exemplo, um departamento usado por uma equipe de vendas ou conta). Substitua "CRM" pelo nome exato do departamento em sua conta.
<script id="ze-snippet"
src="https://static.zdassets.com/ekr/snippet.js?key=ACCOUNT_KEY"> </script>
<script>
// first hide the widget on page load
zE('webWidget', 'hide');
// whenever an unread message appears unhide and open the widget
zE('webWidget:on', 'chat:unreadMessages', function(number) {
zE('webWidget', 'show');
zE('webWidget', 'open');
});
// this callback runs whenever chat first connects (or reconnects)
zE('webWidget:on', 'chat:connected', function() {
// put any code you only want run once here
});
// this callback runs whenever a department status changes
zE('webWidget:on', 'chat:departmentStatus', function(dept) {
// only set the widget online for chat if this department was online
if (dept.name === 'CRM' && dept.status === 'online') {
// apply the chat widget settings
zE('webWidget', 'updateSettings', {
webWidget: {
chat: {
departments: {
enabled: [''],
select: 'CRM'
},
suppress: false
}
}
});
} else if (dept.name === 'CRM' && dept.status !== 'online') {
// or suppress chat (optional: apply contact form settings here)
zE('webWidget', 'updateSettings', {
webWidget: {
chat: {
suppress: true
}
}
});
}
});
</script>
Eis dois pontos sobre o script. Você pode omitir a ocultação inicial e a exibição subsequente em uma mensagem não lida sem alterar o restante do script. Como essas chamadas são executadas assim que o widget carrega, o script as coloca no topo. Eles são opcionais.
Alguns fluxos de trabalho personalizados colocam um bloco de API de updateSettings em um retorno de chamada chat:connected, mas você também pode colocá-lo em um retorno de chamada chat:departmentStatus. O widget o aplica na primeira conexão ou após uma reconfiguração devido a um tempo limite da sessão. Em geral, vincule seu fluxo de trabalho ao evento em que a configuração deve entrar em vigor:
- Use
chat:connectedpara lógica que deve ser executada uma vez por sessão de chat, como a configuração inicial que não deve ser repetida após cada atualização do status do departamento. - Use
chat:departmentStatuspara lógica que deve permanecer em sincronia com a disponibilidade do departamento ou alterações de encaminhamento, pois ela pode ser acionada quando o status do departamento muda e quando o widget inicializa.
Para obter mais informações sobre os diferentes fluxos de trabalho da API do Web Widget (clássico), consulte:
- Posso configurar o Web Widget (clássico) para apresentar o Chat na minha página da web apenas quando um departamento específico estiver online?
- Posso reaplicar o departamento após um visitante do chat com tempo limite se reconectar?
- Como posso garantir que o Formulário pré-chat seja apresentado ao visitante se ele expirar mas reconectar?
Aviso sobre a tradução: este artigo foi traduzido por um software de tradução automática para oferecer a você uma compreensão básica do conteúdo. Medidas razoáveis foram tomadas para fornecer uma tradução precisa, no entanto, a Zendesk não garante a precisão da tradução.
Em caso de dúvidas relacionadas à precisão das informações contidas no artigo traduzido, consulte a versão oficial do artigo em inglês.