Manual do widget
Widgets são interfaces configuráveis que permitem personalizações como cores, imagens e nomes, tornando cada um deles único para o usuário. Entre as opções de personalização, você pode escolher a cor principal, adicionar um avatar, definir um título e até selecionar um papel de parede, entre outras possibilidades. Neste guia, explicaremos cada uma dessas configurações e mostraremos o processo de criação de um widget passo a passo.
O objetivo principal do widget é facilitar a comunicação entre o usuário final e nossa engine, ou até mesmo com nossa equipe de atendimento. Incorporado diretamente no site do cliente, o widget oferece praticidade e conveniência, eliminando a necessidade de acessar outros sites ou canais para interação.
Como criar um widget
No menu CITSmart Aura, selecione a opção Widget.

Uma página com todos os widgets já registrados será exibida. Para criar um novo, clique em "Novo widget".

Personalizando seu Widget
Após clicar em "Novo Widget" você será redirecionado para a página de personalização.

Na página de personalização, preencha as seguintes informações para configurar o widget:
- Nome do chat: Nome exibido no topo do widget, ao lado do avatar.
- Avatar do chat: Imagem do avatar do chatbot, com tamanho máximo de 100x100 pixels.
- Cor principal: Cor predominante do widget, visível no cabeçalho e rodapé.
- Cor do título: Cor do texto no cabeçalho do widget.
- Cor da fonte: Cor usada para o texto dentro do widget.
- Cor usuário: Cor usada para identificar as mensagens enviadas pelo usuário.
- Cor atendente: Cor usada para identificar as mensagens enviadas pelo atendente.
- Papel de fundo: É possível personalizar o papel de fundo do widget. Sendo possível escolher uma das quatro opções disponíveis para personalizar o fundo do widget.
- Ícone do botão de acionamento: É possível escolher entre quatro opções para personalizar o fundo do widget, com tamanho máximo de 100x100 pixels
Nota: Para selecionar cores, clique na caixa de cor, e uma janela pop-up será exibida para escolher a cor desejada.
À medida que realiza as personalizações, uma pré-visualização aparecerá ao lado das configurações. Quando concluir, clique em Salvar para criar o widget.
Editando um Widget
Para editar um Widget existente, siga os passos:
- Na tela de listagem de widgets, encontre o widget que deseja modificar.
- Clique no ícone de pincel Editar widget.

- Faça as alterações necessárias na tela de edição.
- Clique em Salvar para aplicar e registrar as mudanças.
Excluindo um Widget
Para excluir um Widget, siga os passos abaixo:
- Na tela de listagem, encontre o widget que deseja excluir.
- Clique no ícone de lixeira ao lado do nome do widget.

- Um modal de confirmação será exibido. Clique em Sim para confirmar a exclusão.
Atenção: Uma vez excluído, o widget não poderá ser recuperado. Para usá-lo novamente, será necessário criar um novo.
Acessando o Widget
Após configurar e criar o widget, acesse a página de listagem. Nessa tela, você poderá visualizar todos os widgets criados.
Para abrir a interface do chatbot, clique em "Link para o chat aplicado".

Isso abrirá um link para a interface do seu chatbot.

Criando comportamento para o Widget
Para que o widget responda às interações, é necessário registrar um comportamento. Siga os passos abaixo:
- Acesse o menu Chatbots.

- Caso ainda não possua, crie um "Chatbot" clicando em "Novo Chatbot".

- Insira o nome desejado e clique em "Criar novo chatbot". Em seguida, clique no nome do chatbot recém-criado para acessá-lo.
- No card "Registrar novo comportamento", clique em "Avançar".

- Preencha o formulário de registro conforme indicado:
- Nome do Comportamento: Nome para identificar o comportamento.
- Selecione o Manifesto: Escolha o manifesto do tipo "Widget".
- Parâmetros: Escolha o Widget que deseja cadastrar.
- Após registrar os comportamentos, volte para a listagem de widgets e clique em "Link para o chat aplicado" referente ao widget configurado. Isso abrirá a interface do seu chatbot e será possível realizar as interações desejadas.
