CONNECT
Widget
O widget é um dos meios de comunicação que o Altu disponibiliza. Ao optar por esse canal o assistente fica disponível diretamente na interface do cliente (seja via site ou aplicativo). Uma de suas vantagens é a possibilidade de configurar a interação do usuário utilizando diversos componentes: botões de resposta rápida, máscara para preenchimento de campos, listas de opções, entre outros.
A exibição do widget também pode ser customizada com templates que se adequam à identidade visual da empresa.
Compatibilidade
Input:
- Texto
- Arquivos
Output:
- Pergunta aberta
- Autocomplete
- Data
- Encerrar Chat
- Feedback NPS
- Feedback emoji
- Lista de opções: Modal e Inline
- Quick Replies
- Upload de arquivo
- Carrossel de Opções
Configurações
Para começar, vamos criar o seu canal.
Clique no botão inferior direito e abrirá a tela de edição.
Adicione as informações solicitadas:
- Título da Página: nome que será informado na aba do navegador
- Nome do Widget: nome que deseja dar ao canal
- Squad: selecione o nome da squad se estiver disponível na lista, caso contrário mantenha como “geral”
- Digitando: escolha de que modo a mensagem deve aparecer para o usuário
- Dinâmica - apresenta uma imagem de “digitando” durante o tempo definido até o envio da mensagem:
- Estáticas - envia a mensagem após o tempo de espera definido, sem indicação de carregamento:
.gif?alt=media&token=c119fbd8-16b3-490e-88b6-f1d5730cde5f)
- Template: é a área de personalização da aparência do bot. Temos como padrão o tema “ALTU” e "basic", mas o CSS pode ser editado livremente para atender ao guia de estilo da empresa. Também é possível adicionar um logo e avatar de até 1MB nos formatos: png, jpeg, jpg, svg e gif.
Opcionais:
- Inatividade: ao selecionar essa opção, o assistente será reiniciado ao observar a inatividade do usuário após o tempo definido
- Esperar por dados: opção específica para assistentes que são exibidos via overlay do Smarkio Legacy. Ao ser ativada o assistente pode receber dados do usuário pela URL de exibição do chat
- Continuidade da conversa: ao final de uma interação as mensagens serão salvas no histórico do navegador e o usuário poderá dar continuidade a conversa futuramente
- Ativar avisos sonoros em Live Chat: ao selecionar essa funcionalidade o cliente será notificado, por meio de um aviso sonoro, quando um agente enviar uma mensagem durante o atendimento. O aviso pode ser customizado ao adicionar o endereço web onde está hospedado o arquivo de áudio
Para garantir o funcionamento da notificação sonora é recomendado que o áudio seja verificado no campo “Validar”. Em seguida, se estiver tudo certo, o som será processado e executado, certificando sua performance no Live Chat.
Para uma validação bem sucedida o link informado deve conter um áudio com, no máximo, 5 segundos de duração. Exemplo de URL (nosso áudio default): https://altu-assets.s3-sa-east-1.amazonaws.com/sounds/notification-livechat.mp3
Durante a conversa com o agente, o cliente pode desativar ou ativar essa notificação, por default o Live Chat deixa o áudio ativado. O botão para realizar essa ação estará disponível no topo do chat, juntamente com os botões para "Sair do chat" e "Sair do live chat".
Confira nosso vídeo com a demonstração da funcionalidade:
Coletar IP e user agent em acessos
O IP do usuário e User Agent serão coletados quando o usuário acessar o Widget e direcionado para a variável
url_params do context. Com as informações do
user_agent é possível identificar:- Aplicação
- Sistema operacional
- Fornecedor
- Navegador de internet
Exemplo de como fica estruturado o IP e user agent no url_params:
1
{
2
"url_params": {
3
"ip": "127.0.0.1",
4
"user_agent": {
5
"os": {
6
"name": "Linux",
7
"version": "x86_64"
8
},
9
"ua": "Mozilla/5.0 (X11; Linux x86_64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/89.0.4389.90 Safari/537.36",
10
"cpu": {
11
"architecture": "amd64"
12
},
13
"device": {},
14
"engine": {
15
"name": "Blink",
16
"version": "89.0.4389.90"
17
},
18
"browser": {
19
"name": "Chrome",
20
"major": "89",
21
"version": "89.0.4389.90"
22
}
23
}
24
}
25
}
Copied!
Baixar conversa
Durante todo o atendimento, será possível realizar o download da conversa. Isso é realizado através da chamada de uma função:
download_chat_history ().PDF
Cabeçalho
O cabeçalho do PDF irá conter três informações:
- O título: "Histórico do Atendimento".
- O subtítulo: será opcional e é o único que pode ser passado por parâmetro na função. A imagem acima é resultante da chamada:
download_chat_history ("ALTU"). Se não não for houver parâmetro passado, o cabeçalho será o seguinte: - A data da exportação.
Corpo
O corpo do PDF é composto pelo conteúdo do atendimento, ou seja, a troca de mensagens. É compatível com pré-visualização de imagens. Nele, também exibimos o momento (data e hora) em que ocorreu a troca de mensagens de cada bloco. Links no atendimento, que possibilitam download do arquivo pré-visualizado, não estarão acessíveis dentro do PDF.
Como usar?
O PDF pode ser gerado por meio de um Socket Event, que chama a função. Você deve incluir na configuração do Widget, no bloco body, o seguinte código:
1
<script type="text/javascript">
2
$(document).ready(function() {
3
if(socket)
4
{
5
socket.on('exportPDF', function(payload) {
6
download_chat_history(payload.chat_name)
7
});
8
}
9
});
10
</script>
Copied!
Pode-se perguntar se o usuário deseja exportar a conversa, tal qual um protocolo. Se a resposta for positiva, em seguida, chamaria um Socket Event, como o que está abaixo:
1
[
2
{
3
"name": "socket_event",
4
"parameters": {
5
"event": "exportPDF",
6
"payload": {
7
"chat_name": "ALTU"
8
}
9
},
10
"result_variable": "event_response"
11
}
12
]
Copied!
Exemplo de um atendimento com download de PDF:
Last modified 6mo ago