Colocar um chat no site WordPress é mais simples do que parece. Na maioria dos casos, basta copiar um trecho de código da sua plataforma de atendimento e colar em um lugar específico do WordPress. Em dez minutos, o botão de chat aparece no canto de todas as páginas e o seu site passa a conversar com os visitantes.
O que costuma dar errado não é a instalação em si, mas os detalhes: o chat que some depois de ativar um plugin de cache, o código colado no lugar errado que desaparece na próxima atualização do tema, o widget que deixa o site mais lento no celular.
Neste guia, você vai ver as quatro formas de instalar um chat no WordPress, qual escolher para o seu caso, o passo a passo de cada uma e os cuidados que evitam dor de cabeça depois.
Antes de começar: o que você precisa ter em mãos
Antes de mexer no WordPress, separe três coisas:
- Uma conta em uma plataforma de chat. É ela que recebe as mensagens e onde a equipe responde. Pode ser uma ferramenta só de chat ou uma plataforma de atendimento completa, que junta chat do site, WhatsApp, chatbot e CRM no mesmo painel, como o Azallon Dispara PRO.
- O código do widget. A plataforma gera um trecho de código (normalmente começando com
<script) que faz o chat aparecer no site. Ele costuma ficar nas configurações do canal de chat, com um nome como “código de instalação”, “script do widget” ou “incorporar no site”. - Acesso de administrador ao WordPress. Para instalar plugins ou inserir código, o seu usuário precisa ter perfil de administrador.
O código do widget tem um formato parecido com este (o seu será diferente, com o endereço e a identificação da sua conta):
<script src="https://exemplo-da-plataforma.com/widget.js" data-id="SUA-CONTA" async></script>
Não altere nada no código. Copie exatamente como a plataforma entregou.
As quatro formas de instalar um chat no WordPress
| Método | Para quem | Dificuldade | Sobrevive à troca de tema? |
|---|---|---|---|
| Plugin de inserção de scripts | A maioria dos sites | Fácil | Sim |
| Elementor (código personalizado) | Sites feitos com Elementor Pro | Fácil | Sim, enquanto usar o Elementor |
| Google Tag Manager | Sites que já usam o GTM para rastreamento | Média | Sim |
| Arquivo do tema (footer.php) | Desenvolvedores, com tema filho | Avançada | Não |
Para a maioria das empresas, o plugin de inserção de scripts é o caminho mais seguro. Ele não depende do tema, não exige programação e permite desativar o chat com um clique se algo der errado.
Método 1: instalar com um plugin de inserção de scripts (recomendado)
Existem vários plugins gratuitos que permitem colar códigos no cabeçalho ou no rodapé de todas as páginas. Um dos mais usados é o WPCode (antigo “Insert Headers and Footers”). O passo a passo abaixo usa ele, mas a lógica é a mesma em plugins parecidos.
- Instale o plugin. No painel do WordPress, vá em Plugins > Adicionar novo, pesquise por “WPCode”, clique em Instalar agora e depois em Ativar.
- Abra a área de cabeçalho e rodapé. No menu lateral, acesse Code Snippets > Header & Footer (o nome pode aparecer traduzido como “Cabeçalho e rodapé”).
- Cole o código no rodapé. No campo Footer (rodapé), cole o código do widget do chat. O rodapé é o lugar recomendado para a maioria dos widgets, porque o código carrega depois do conteúdo da página e não atrasa a exibição do site.
- Salve. Clique em Salvar alterações.
- Limpe o cache. Se o seu site usa plugin de cache ou CDN, limpe o cache (veja a seção sobre cache mais abaixo).
- Teste. Abra o site em uma janela anônima do navegador. O botão do chat deve aparecer no canto da tela.
Se a sua plataforma pedir que o código fique no cabeçalho (algumas pedem), use o campo Header em vez do Footer. Siga sempre a orientação da plataforma.
Método 2: instalar pelo Elementor
Se o seu site foi feito com o Elementor Pro, você pode usar o recurso de código personalizado, sem instalar outro plugin.
- No painel do WordPress, vá em Elementor > Código personalizado (Custom Code).
- Clique em Adicionar novo e dê um nome, como “Chat do site”.
- Cole o código do widget no editor.
- Em Local, escolha Fim do body (body end).
- Clique em Publicar e, na janela de condições, escolha Site inteiro.
- Limpe o cache e teste em uma janela anônima.
Na versão gratuita do Elementor, esse recurso não está disponível. Nesse caso, use o método 1.
Método 3: instalar pelo Google Tag Manager
Se o seu site já tem o Google Tag Manager instalado (é comum em sites que fazem anúncios e rastreamento de conversões), o chat pode ser publicado por ele.
- No Google Tag Manager, abra o contêiner do site e clique em Tags > Nova.
- Escolha o tipo de tag HTML personalizado.
- Cole o código do widget.
- Em Acionamento, escolha All Pages (todas as páginas).
- Salve, clique em Visualizar para testar e, se o chat aparecer, clique em Enviar para publicar.
A vantagem é gerenciar o chat junto com os outros códigos de rastreamento, sem mexer no WordPress. A desvantagem é que alguns widgets não funcionam bem quando carregados pelo GTM. Se o chat não aparecer no modo de visualização, use o método 1.
Método 4: inserir no arquivo do tema (só para quem domina o WordPress)
É possível colar o código diretamente no arquivo footer.php do tema, antes da tag </body>. Esse método funciona, mas tem dois problemas sérios:
- O código some quando o tema é atualizado, a menos que você use um tema filho.
- Um erro de digitação pode derrubar o site, porque você está editando um arquivo do sistema.
Além disso, temas mais novos, baseados em blocos, nem sempre têm o arquivo footer.php. Se você não tem experiência com tema filho e edição de arquivos, prefira o método 1.
Cuidado com o cache e os plugins de otimização
Este é o motivo número um de “instalei e o chat não aparece”.
Limpe o cache depois de instalar
Plugins de cache, como WP Rocket, LiteSpeed Cache, W3 Total Cache e WP Super Cache, guardam uma cópia pronta das páginas. Se você instalou o chat e não limpou o cache, os visitantes continuam vendo a versão antiga, sem o chat. Depois de qualquer alteração, use a opção Limpar cache do plugin e, se houver, da CDN (como o Cloudflare).
Atenção ao atraso de JavaScript
Muitos plugins de otimização têm opções como “atrasar a execução do JavaScript” ou “adiar JavaScript”. Elas melhoram a velocidade, mas podem impedir o widget de carregar ou fazer ele aparecer só depois que o visitante rola a página.
Se o chat não aparecer ou demorar muito, procure nas configurações do plugin de otimização a lista de exclusões e adicione o endereço do script do chat (por exemplo, o domínio que aparece no src do código). Assim, o chat continua carregando normalmente e o resto do site segue otimizado.
Agrupamento e minificação
Opções que juntam ou comprimem arquivos JavaScript também podem quebrar o widget. Se algo der errado, teste desativando essas opções uma de cada vez para encontrar o culpado e, depois, exclua o script do chat dessa otimização.
O chat deixa o site mais lento?
Todo código extra tem algum custo, mas um widget de chat bem feito tem impacto pequeno quando instalado do jeito certo. Para manter o site rápido:
- Cole o código no rodapé, a menos que a plataforma peça o cabeçalho.
- Mantenha o atributo
asyncoudefer, se ele vier no código. Ele faz o script carregar sem travar o resto da página. - Não instale dois chats ao mesmo tempo. Um plugin de chat antigo esquecido junto com o novo dobra o peso e pode gerar dois botões na tela.
- Meça antes e depois. Use o PageSpeed Insights do Google para comparar a nota do site antes e depois da instalação. Se a queda for grande, revise as configurações de otimização.
Mostrar o chat só em algumas páginas
Às vezes, faz sentido ter o chat apenas em parte do site, como páginas de produto e de preços, e não na área do cliente ou em páginas de checkout. Algumas opções:
- No plugin de inserção de scripts: alguns plugins permitem criar o código como um “snippet” com regras de exibição por página, tipo de conteúdo ou URL.
- No Elementor Pro: nas condições do código personalizado, escolha incluir ou excluir páginas específicas.
- No Google Tag Manager: troque o acionamento “All Pages” por um acionamento que dispare só em URLs que contenham determinado trecho.
- Na plataforma de chat: muitas plataformas permitem definir, nas configurações do widget, em quais endereços ele deve aparecer.
Como testar se o chat está funcionando
Depois de instalar, faça este roteiro de testes:
- Abra o site em uma janela anônima, para não ver uma versão em cache do seu navegador.
- Teste no computador e no celular. Confira se o botão aparece e se não cobre outros elementos, como o botão de compra ou o aviso de cookies.
- Envie uma mensagem de teste e verifique se ela chega ao painel da plataforma.
- Percorra o fluxo do chatbot, se houver: cadastro, menu, cada opção e a transferência para a fila de atendimento.
- Responda pelo painel e confira se a resposta aparece na janela do site.
- Teste fora do horário de atendimento, se a plataforma tiver mensagem de ausência.
- Navegue por várias páginas para confirmar que o chat aparece em todo o site (ou só onde deveria).
Problemas comuns e como resolver
| Problema | Causa provável | Solução |
|---|---|---|
| O chat não aparece | Cache não foi limpo | Limpe o cache do plugin e da CDN e teste em janela anônima |
| O chat aparece só depois de rolar a página | Atraso de JavaScript do plugin de otimização | Exclua o script do chat do atraso de JavaScript |
| Aparecem dois botões de chat | Plugin ou código antigo ainda ativo | Remova o chat antigo e mantenha só um código |
| O chat sumiu depois de atualizar o tema | Código colado no footer.php do tema | Reinstale pelo plugin de inserção de scripts |
| O botão cobre outros elementos no celular | Posição padrão do widget | Ajuste a posição ou a margem nas configurações do widget |
| As mensagens não chegam ao painel | Código de outra conta ou canal desativado | Copie novamente o código do canal correto e verifique se ele está ativo |
| O site ficou lento | Script sem async ou chats duplicados | Mantenha o async, remova duplicados e revise as otimizações |
Plugin de chat ou plataforma de atendimento?
No repositório do WordPress, existem plugins que já trazem um chat pronto, com o painel de respostas dentro do próprio WordPress. Eles podem resolver para sites muito pequenos, mas têm limites quando o atendimento cresce:
- A equipe precisa entrar no painel do WordPress para responder.
- O chat do site fica separado do WhatsApp e dos outros canais.
- Recursos como filas por setor, chatbot com fluxo, CRM e relatórios costumam ser limitados ou pagos à parte.
Com uma plataforma de atendimento, o WordPress só exibe o widget. As conversas vão para um painel próprio, onde a equipe atende o site e o WhatsApp juntos, com chatbot, filas e histórico. Para empresas que vendem e dão suporte pelo chat, esse costuma ser o caminho mais sustentável.
Chat no WordPress com o Azallon Dispara PRO
O Azallon Dispara PRO é a plataforma de atendimento e automação da Azallon na API oficial do WhatsApp. Ele reúne chatbot, multiatendimento com CRM, automações e WebChat para site, com as conversas do site e do WhatsApp no mesmo painel.
Para colocar o chat no seu WordPress com o Azallon Dispara PRO:
- Crie o canal de WebChat na plataforma e copie o código do widget.
- Cole o código no rodapé do site com um plugin de inserção de scripts, como mostrado no método 1.
- Limpe o cache e teste em uma janela anônima.
- Monte o chatbot com o fluxo visual: mensagem de boas-vindas, cadastro, menu e transferência para as filas.
- Atenda as conversas do site no mesmo painel do WhatsApp.
Se preferir, a equipe da Azallon orienta ou faz a instalação com você.
Para tirar o máximo do chat depois de instalado, veja também:
- WebChat para site: como atender e vender pelo chat do seu site
- Chatbot para site: como funciona e quando vale a pena
- Como captar leads pelo chat do site
- WebChat ou botão de WhatsApp no site: qual usar?
Perguntas frequentes
Como colocar chat no site WordPress?
Copie o código do widget na sua plataforma de chat, instale um plugin de inserção de scripts, como o WPCode, cole o código no campo de rodapé, salve, limpe o cache e teste o site em uma janela anônima.
Preciso de programador para instalar um chat no WordPress?
Não. Com um plugin de inserção de scripts, basta copiar e colar o código fornecido pela plataforma de chat. Só a edição direta de arquivos do tema exige conhecimento técnico.
Onde colar o código do chat: no cabeçalho ou no rodapé?
Na maioria dos casos, no rodapé, porque o código carrega depois do conteúdo e não atrasa a exibição da página. Se a plataforma de chat pedir o cabeçalho, siga a orientação dela.
Por que o chat não aparece no meu site WordPress?
O motivo mais comum é o cache. Limpe o cache do plugin e da CDN e teste em uma janela anônima. Se continuar sem aparecer, verifique se o plugin de otimização está atrasando ou agrupando o JavaScript e exclua o script do chat dessas opções.
O chat deixa o site WordPress mais lento?
Um widget bem instalado tem impacto pequeno. Cole o código no rodapé, mantenha o atributo async, evite ter dois chats instalados e compare a nota do PageSpeed Insights antes e depois.
Dá para mostrar o chat só em algumas páginas?
Sim. Você pode usar regras de exibição no plugin de inserção de scripts, as condições do Elementor Pro, um acionamento por URL no Google Tag Manager ou as configurações do próprio widget na plataforma de chat.
O chat do site pode funcionar junto com o WhatsApp?
Sim. Com uma plataforma como o Azallon Dispara PRO, as conversas do chat do site e do WhatsApp chegam ao mesmo painel, com o mesmo chatbot, as mesmas filas e o mesmo histórico.
Conclusão
Colocar chat no site WordPress leva poucos minutos: copiar o código da plataforma, colar no rodapé com um plugin de inserção de scripts, limpar o cache e testar. Os cuidados que fazem diferença vêm depois: excluir o script das otimizações que atrasam o JavaScript, evitar chats duplicados, conferir a posição do botão no celular e percorrer todo o fluxo do chatbot antes de divulgar.
Com o chat no ar, o próximo passo é garantir que cada conversa seja bem atendida: chatbot para o primeiro contato, filas por setor e uma equipe pronta para assumir. A Azallon atua com automação de atendimento desde 2020 e ajuda a sua empresa a instalar o WebChat no WordPress e a montar todo o atendimento no Azallon Dispara PRO.
Quer ver um chat funcionando em um site WordPress? Acesse azallon.com.br, abra o chat de “Vendas e suporte” e converse com o nosso atendimento. Se preferir, ligue para (16) 98149-5853.
