O AI Growth Widget permite adicionar um widget de chat personalizável ao seu site, para que visitantes possam interagir com a sua empresa e entrar em contato por meio dos canais de mensagens compatíveis.

Este guia orienta você em todas as etapas para criar e configurar um AI Growth Widget — desde a personalização da marca e definições de engajamento até a instalação no seu site e a verificação do funcionamento correto. Ao final da configuração, seu widget estará pronto para entrar no ar e interagir com visitantes.

Acessando a página de configuração do AI Growth Widget

Siga as etapas abaixo para acessar a página de configuração do AI Growth Widget:

1. Acesse a página “Canais” clicando no ícone correspondente na barra de navegação à esquerda.
2. Na página “Canais”, clique em “AI Growth Widget” no painel lateral esquerdo.
3. Você será redirecionado para a página inicial do AI Growth Widget.
   
4. Para criar seu AI Growth Widget, clique em “Iniciar configuração”.

Etapa 1: Marca e configurações básicas

Nesta etapa, você personaliza a aparência do AI Growth Widget e como ele será exibido aos visitantes do seu site. Você definirá a identidade da sua marca, a mensagem padrão e as configurações de idioma.

Personalizar identidade da marca

Em Identidade da marca, configure os elementos visuais e de exibição do widget. Essas definições controlam como o widget aparece no seu site e como sua empresa é representada nas conversas.

• Logo da empresa
  
  • Faça upload de um logo para representar sua marca. Esse logo aparece na tela de boas-vindas do widget e também é utilizado como avatar do remetente nas conversas de chat.
     
• Cor do botão
  
  • Escolha a cor usada no botão do widget e nos principais elementos de chamada para ação. Isso ajuda a alinhar visualmente o widget à identidade do seu site.
    • Clique no iícone para selecionar uma cor, ou insira diretamente o código de cor HEX
       
• Cor da bolha de mensagem
  
  • Defina a cor utilizada nas bolhas de mensagem dentro da janela de chat. Isso influencia a aparência das mensagens durante as conversas com visitantes.
    • Clique no ícone para selecionar uma cor, ou insira diretamente o código de cor HEX
       
• Nome exibido no chat ao vivo
  
  • Insira o nome exibido aos visitantes como título do widget. Geralmente, é o nome da sua empresa ou produto e ajuda os visitantes a identificarem com quem estão conversando.
     
• Nome de exibição do remetente
  
  • Defina o nome exibido como remetente das mensagens no chat. Esse é o nome que os visitantes verão nas respostas enviadas pelo widget.
     
• Mensagem de boas-vindas
  
  • Insira a mensagem padrão exibida quando um visitante inicia um chat em uma página que não possui mensagem pop-up configurada. Essa mensagem define o tom da conversa e incentiva o engajamento.

Escolher o modo de exibição do widget

Em “Modo de exibição do widget”, selecione como o AI Growth Widget deve aparecer e se comportar no seu site. Essa configuração define a experiência principal de interação para seus visitantes.

Você pode escolher entre dois modos de exibição:

Widget Navigator

Uma barra de chat flutuante posicionada no centro inferior do seu site.

• Expande para uma experiência de chat mais focada
• Escurece o fundo para direcionar a atenção para a conversa
• Projetado para engajar ativamente os visitantes durante a navegação
• Inclui uma barra lateral integrada para visualizar links compartilhados pelo Agente de IA

Quando o Agente de IA inclui links na resposta, a barra lateral é aberta automaticamente e exibe o primeiro link em uma visualização integrada do navegador. Se houver vários links, os visitantes podem alternar entre eles usando o rodapé da barra lateral, clicar nos links no chat para atualizar o conteúdo exibido ou abrir a página em uma nova aba do navegador.

Isso permite que os visitantes continuem navegando por páginas de produtos, artigos ou formulários sem sair do seu site ou interromper a conversa.

💡 Ideal para: descoberta de produtos e engajamento guiado

Widget de Suporte

Um ícone de chat clássico posicionado no canto do seu site.

• Abre uma janela de chat ao ser clicado
• Permanece visível sem interromper a experiência de navegação
• Projetado para oferecer suporte em um formato familiar e de baixa fricção
• Mantém o conteúdo do site totalmente em foco até que o visitante decida iniciar uma conversa

Isso permite que os visitantes naveguem pelo seu site no próprio ritmo e entrem em contato apenas quando precisarem de ajuda.

💡 Ideal para: suporte contínuo e engajamento passivo

Configurar definições de idioma

Em Configurações de idioma, escolha os idiomas compatíveis com seu AI Growth Widget. Essas definições determinam qual versão do widget será exibida aos visitantes.

• Idioma principal
  
  • Escolha o idioma padrão do seu widget. Esse idioma será utilizado quando o idioma do navegador do visitante não for compatível.
    • Clique no menu suspenso para selecionar um idioma.
       
• Idiomas adicionais
  • Adicione outros idiomas para oferecer uma experiência localizada aos visitantes.
    • Clique em “Adicionar” para incluir idiomas adicionais compatíveis.
    • Os visitantes visualizarão o widget em um idioma compatível com as configurações do navegador. Caso não haja correspondência, o idioma principal será utilizado.

Etapa 2: Engajamento e canais

Nesta etapa, você define como os visitantes interagem com seu AI Growth Widget. Isso inclui configurar mensagens pop-up, decidir se deseja coletar dados de contato e escolher quais canais externos de mensagens estarão disponíveis.

Configurar mensagem pop-up

Em Mensagem pop-up, você pode criar uma mensagem curta exibida no seu site para cumprimentar visitantes e incentivá-los a iniciar uma conversa.

• Nome da mensagem
  • Insira um nome para identificar essa mensagem pop-up. Esse nome é apenas para referência interna e não é exibido aos visitantes.
• Conteúdo da mensagem
  • Insira a mensagem exibida quando o pop-up aparecer. Ela deve ser curta e envolvente, com limite de 500 caracteres.
• Tempo de exibição
  • Escolha quanto tempo esperar antes de exibir o pop-up após o visitante acessar a página.
  • Insira um número para definir o atraso em segundos. Por exemplo, se você inserir 3, a mensagem pop-up aparecerá 3 segundos após o visitante acessar a página.
  • Esse atraso será aplicado a cada visita em páginas onde o pop-up estiver ativado.

Configurar “Coletar dados do cliente”

Ative Coletar dados do cliente se desejar que visitantes informem seus dados de contato antes de iniciar a conversa.

Quando essa opção estiver ativada, o visitante deverá preencher os dados obrigatórios antes de continuar o chat pelo widget.

Você pode escolher quais informações coletar:

• Número de telefone obrigatório: o visitante deve inserir um número de telefone válido antes de iniciar a conversa.
• Endereço de e-mail obrigatório: o visitante deve inserir um e-mail válido antes de iniciar a conversa.

Você pode ativar uma ou ambas as opções, conforme a necessidade.

Configurar canais externos de mensagens (opcional)

Os canais externos permitem que visitantes entrem em contato com sua empresa por meio de plataformas de mensagens compatíveis, em vez de continuar a conversa dentro do widget.

Apenas canais já conectados no seu espaço de trabalho podem ser ativados e exibidos aos visitantes.

Para cada canal, você pode:

• Selecionar uma conta conectada (quando aplicável)
• Ativar ou desativar o canal para controlar se ele será exibido no widget

Quando ativados, esses canais aparecerão como opções alternativas de contato no widget, permitindo que visitantes escolham como desejam falar com sua empresa.

Adicionando chamada telefônica como canal de mensagens externo

Você também pode adicionar uma linha telefônica direta ao seu widget, permitindo que os visitantes entrem em contato com sua equipe de vendas ou suporte com um único clique.

Em Chamada telefônica, configure o seguinte:

• Número de telefone: Insira o número completo no formato internacional, por exemplo: +1 234 567 890

Como funciona para os visitantes:

• No celular: Ao tocar na opção de telefone, o discador nativo do dispositivo será aberto com o número já preenchido
• No desktop: Ao clicar na opção de telefone, pode ser aberto um aplicativo de chamadas, como o FaceTime, ou o visitante poderá visualizar o número e discá-lo manualmente

Quando ativado, o canal de Chamada telefônica aparecerá junto com seus outros canais de mensagens externos na seção Fale conosco do widget.

Etapa 3: Publicar

Nesta etapa, você instalará o AI Growth Widget no seu site e verificará se ele está funcionando corretamente antes de concluir a configuração.

Instalar e publicar o widget no seu site

Siga as instruções exibidas na tela para instalar o widget:

1. Acesse seu site
   1. Faça login na plataforma do seu site e abra o editor de código
2. Insira o snippet de código
   1. Copie o snippet exibido e cole-o no código do seu site
   2. Para exibir o widget em páginas específicas, cole o snippet antes da tag de fechamento </body> nessas páginas
   3. Para exibir o widget em todas as páginas, adicione o snippet ao cabeçalho ou rodapé global do site
3. Salve e atualize seu site
   1. Após salvar as alterações e atualizar a página, o widget deverá aparecer
4. Teste o widget
   1. Envie uma mensagem de teste pelo widget para confirmar que ele está conectado à SleekFlow

Verificar sua instalação

Após instalar o widget, confirme se ele foi configurado corretamente:

1. Insira a URL da página onde o widget foi instalado
2. Clique em “Verificar instalação”
3. Revise o resultado da verificação

Se a verificação for bem-sucedida

• Você verá uma confirmação informando que a instalação do widget foi realizada com sucesso.
  
• Clique em “Concluído” no canto inferior direito para finalizar a configuração e publicar seu widget.

Se a verificação falhar

• Você verá uma mensagem informando que não foi possível verificar a instalação.
  
• Revise as orientações de solução de problemas e confirme que:
  • O snippet de código foi instalado na página ou domínio corretos.
  • As alterações do seu site foram publicadas.
  • O script do widget não está sendo bloqueado por políticas de segurança de conteúdo ou bloqueadores de anúncios.