Adicionando um widget de chat ao vivo ao site

O widget de chat ao vivo do Deskwoot permite que os visitantes do seu site iniciem conversas direto a partir dele. Ele carrega rápido, funciona perfeitamente no computador e no celular e pode ser personalizado para combinar com a sua marca. Abaixo, você encontra instruções passo a passo para configurar o widget, dicas para aproveitá-lo ao máximo e respostas para dúvidas comuns.

Criando a caixa de entrada do widget

Acesse Configurações > Caixas de entrada > Adicionar caixa de entrada.
Selecione Site como o tipo de canal.
Configure as opções do widget:
- Escolha um nome descritivo para a caixa de entrada (por exemplo, "Chat do site principal").
- Defina a cor da sua marca para que o widget combine com a aparência do seu site.
- Escreva uma mensagem de boas-vindas que cumprimente os visitantes quando eles abrirem o chat.
- Escolha a posição do widget, canto inferior esquerdo ou canto inferior direito.
Clique em Criar para salvar a caixa de entrada.

Instalando o widget

Depois de criar a caixa de entrada, o Deskwoot gera um trecho de código JavaScript. Para instalá-lo:

Copie o trecho de código fornecido.
Cole-o na seção <head> ou logo antes da tag de fechamento </body> de cada página em que você quer que o widget apareça.
Se você usa um gerenciador de tags como o Google Tag Manager, adicione o trecho como uma tag de HTML personalizado em vez disso.

Após publicar, abra o seu site em uma janela anônima para confirmar que o widget carrega corretamente.

Formulários pré-chat

Você pode exigir que os visitantes informem nome e e-mail antes de iniciar um chat. Ative o formulário pré-chat nas configurações da sua caixa de entrada. Isso ajuda a identificar clientes recorrentes e a dar retorno por e-mail caso eles saiam antes de você responder. Coletar os dados de contato logo de início também reduz o número de conversas anônimas que a sua equipe precisa atender.

Personalização do widget

Personalize a aparência do widget nas configurações da sua caixa de entrada. Você pode mudar a cor, a posição, o título de boas-vindas, o slogan e a mensagem de saudação. O widget se adapta automaticamente às telas de celular, então não há necessidade de uma configuração separada para dispositivos móveis.

Dicas de boas práticas

Mantenha a mensagem de boas-vindas curta. Uma ou duas frases simpáticas funcionam melhor do que um parágrafo longo.
Use as cores da sua marca para manter uma experiência consistente para o visitante em todo o seu site.
Ative os formulários pré-chat se a sua equipe não consegue responder em tempo real; assim você garante que poderá dar retorno por e-mail.
Teste em vários dispositivos após a instalação para verificar se o widget aparece e funciona corretamente em navegadores de computador e de celular.

Solução de problemas

Widget não aparece: Certifique-se de que o trecho de JavaScript está colocado corretamente e que nenhuma extensão de navegador ou bloqueador de anúncios está impedindo o carregamento. Limpe o cache e tente uma janela anônima.
Conflitos de estilo: Se o CSS do seu site interferir na aparência do widget, procure por estilos globais que possam sobrepor elementos de iframe ou de botão.
Carregamento lento: Colocar o trecho logo antes da tag de fechamento </body> garante que o widget carregue depois do seu conteúdo principal, reduzindo qualquer impacto na velocidade da página.

Perguntas frequentes

Posso adicionar o widget apenas em páginas específicas?

Sim. Basta incluir o trecho de JavaScript nas páginas em que você quer que o widget apareça e omiti-lo nas demais. Se você usa um gerenciador de tags, configure um acionador que dispare somente nas URLs desejadas.

O widget vai deixar o meu site lento?

O widget foi projetado para carregar de forma assíncrona, então o impacto na velocidade da sua página deve ser mínimo. Colocar o trecho antes da tag de fechamento </body> é recomendado para o melhor desempenho.

Posso usar o widget no Shopify ou no WooCommerce?

Com certeza. Cole o trecho no arquivo de layout do seu tema. No Shopify, use o arquivo theme.liquid; no WooCommerce, use o footer.php do seu tema ou um plugin de script de cabeçalho/rodapé.