COMO PERSONALIZAR O VISUAL DO BOT?
1º passo: dentro do fluxo do bot, acesse a aba "Visual".
2º passo: em "Customize o tema", você encontrará um menu de configurações com várias opções para personalizar a
aparência do seu bot.
3º passo: ao lado do menu de configurações, você visualiza, em tempo real, as customizações realizadas.
Templates
4º passo: no menu de configurações, clique em "Templates".
5º passo: na aba "Meus templates" você encontrará todos os seus modelos salvos. Para salvar o tema atual e criar um novo
modelo, clique em "Salvar tema atual". Você pode usar o mesmo modelo em diferentes bots.
6º passo: dê um nome ao modelo e clique em "Salvar".
7º passo: na aba "Galeria", você encontrará modelos prontos para se inspirar. Se desejar, selecione um dos modelos
disponíveis.
Global
8º passo: no menu de configurações, clique em "Global".
9º passo: para exibir o logo do Toolzz Bots no final do bot, habilite o botão "Mostrar marca do Toolzz Bots".
10º passo: se desejar ter uma barra de progresso na parte superior, indicando o progresso do usuário no bot, ative o
botão "Ativar barra de progresso". Essa barra irá aumentar à medida que o usuário avançar nos caminhos.
Visão do usuário
11º passo: ao ativar a barra de progresso, você pode personalizá-la de acordo com suas preferências.
1. Posição: escolha onde a barra de progresso será exibida no bot. Selecione entre "Topo" (na parte superior do bot) ou
"Fundo" (na parte inferior do bot).
2. Cor: clique no seletor de cores para definir a cor da barra à medida que o usuário avançar nos caminhos do bot.
3. Espessura: defina a espessura da barra. Quanto maior o número, mais grossa será a barra.
4. Posição incorporado: selecione "Fixed" para manter a barra de progresso sempre no topo da janela, mesmo quando o bot
estiver incorporado ou selecione "Absolut" para posicionar a barra de progresso na parte superior do contêiner de
bate-papo.
12º passo: em "Fonte", selecione "Google". Em seguida, no campo que será exibido, escreva o nome da fonte que deseja
utilizar para os textos do bot.
13º passo: ainda na seção "Fonte", você pode personalizá-la selecionando a opção "Custom". Em seguida, nos campos que
serão exibidos, defina a família da fonte desejada e preencha o outro campo com as informações necessárias para inserir
fontes personalizadas de outros sites.
14º passo: em "Plano de fundo", você tem três opções de personalização disponíveis.
1. Cor: ao selecionar essa opção, clique no seletor de cores e escolha a cor do plano de fundo do seu bot.
2. Imagem: essa opção permite inserir um emoji, selecionar uma imagem no Unsplash, inserir link ou fazer o upload de
uma imagem para ser o plano de fundo do seu bot. -Recomendação: 1920x1080 pixels
3. Nenhum: selecionando essa opção, o plano de fundo ficará branco, sem nenhuma personalização.
Chat
15º passo: clique na categoria "Chat" e ative o botão "Avatar do bot". Em seguida, clique na foto de perfil para inserir
a imagem do avatar do bot. Você pode inserir a imagem através de um link, upload, emoji, GIF, imagens ou ícones.
- Recomendação de tamanho da imagem: 128x128, PNG.
16º passo: se quiser que apareça uma imagem de avatar para as respostas dos usuários, habilite o botão "Avatar do
usuário" e insira a imagem realizando o mesmo processo.
17º passo: personalize o texto, o plano de fundo e a borda de cada elemento do chat.
Customizar CSS
18º passo: clique em "Customizar CSS" e no campo selecionado você pode personalizar ainda mais adicionando qualquer CSS
personalizado que desejar.
Pronto! Agora você já sabe como personalizar o visual do seu bot.
