Como criar um canal web

2 min de leitura

Ao integrar o canal, você consegue customizar aspectos do Web Chat como: cor, tempo de espaçamento entre mensagens, indicadores de mensagem, avatar e muito mais! Assim, garantindo tudo que a Weni Plataforma tem a oferecer com a cara da sua marca. Logo abaixo iremos te mostrar o passo a passo para realizar a integração.

Criando um canal web

Para integrar seu chatbot a um canal web, primeiramente você precisa entrar na organização que está localizado o projeto, para que então possamos integrar o canal.
Localize o projeto que você deseja integrar.

${"base64":" ","img":{"width":1918,"height":877,"type":"png","mime":"image/png","wUnits":"px","hUnits":"px","length":77577,"url":"https://raw.githubusercontent.com/vtexdocs/help-center-content/refs/heads/main/docs/pt/tutorials/weni-by-vtex/integra%C3%A7%C3%B5es/como-criar-um-canal-web_1.png"}}$

Na barra lateral, clique em Aplicativos.
Ao clicar em Aplicativos > Descoberta, você seleciona a opção Weni Web Chat.
Clique no botão acessar meus aplicativos e clique mais uma vez no card Weni Web Chat para ter acesso as configurações de customização.

${"base64":" ","img":{"width":1919,"height":871,"type":"png","mime":"image/png","wUnits":"px","hUnits":"px","length":197951,"url":"https://raw.githubusercontent.com/vtexdocs/help-center-content/refs/heads/main/docs/pt/tutorials/weni-by-vtex/integra%C3%A7%C3%B5es/como-criar-um-canal-web_2.png"}}$

Ao abrir o painel de customização da Weni Web Chat, você terá as seguintes opções para configurar:

Título do seu chat;
Subtítulo do chat (opcional);
Mensagem de disparo: quando ativada é a primeira mensagem que seu chatbot envia (opcional);
Mensagem de notificação do chat (opcional);
Mostrar botão de tela cheia (opcional);
Indicador de mensagens não lidas (opcional);
Manter histórico de mensagens (opcional);
Tempo entre as mensagens.

${"base64":" ","img":{"width":1918,"height":870,"type":"png","mime":"image/png","wUnits":"px","hUnits":"px","length":240751,"url":"https://raw.githubusercontent.com/vtexdocs/help-center-content/refs/heads/main/docs/pt/tutorials/weni-by-vtex/integra%C3%A7%C3%B5es/como-criar-um-canal-web_3.png"}}$

${"base64":" ","img":{"width":1918,"height":872,"type":"png","mime":"image/png","wUnits":"px","hUnits":"px","length":229043,"url":"https://raw.githubusercontent.com/vtexdocs/help-center-content/refs/heads/main/docs/pt/tutorials/weni-by-vtex/integra%C3%A7%C3%B5es/como-criar-um-canal-web_4.png"}}$

Seguindo para a aba de aparências, você tem a opção de customizar o chat através do formato CSS. Além disso, você pode importar uma imagem em png, jpg ou jpeg para ser seu avatar e também alterar a cor do seu chat.

${"base64":" ","img":{"width":1918,"height":870,"type":"png","mime":"image/png","wUnits":"px","hUnits":"px","length":249917,"url":"https://raw.githubusercontent.com/vtexdocs/help-center-content/refs/heads/main/docs/pt/tutorials/weni-by-vtex/integra%C3%A7%C3%B5es/como-criar-um-canal-web_5.png"}}$

Ao finalizar a customização, para instalar o Weni Web Chat no seu site, copie este código, que aparecerá ao clicar em código script e cole acima da última tag </body> no seu site.

${"base64":" ","img":{"width":1918,"height":873,"type":"png","mime":"image/png","wUnits":"px","hUnits":"px","length":279772,"url":"https://raw.githubusercontent.com/vtexdocs/help-center-content/refs/heads/main/docs/pt/tutorials/weni-by-vtex/integra%C3%A7%C3%B5es/como-criar-um-canal-web_6.png"}}$