Como adicionar um chatbot de IA ao WordPress

Formas de adicionar um chatbot ao WordPress

Este guia mostra a via do widget com o Elfsight AI Chatbot e, depois, o que implica criar o seu próprio.

Crie o chatbot

1. 1.

   Escolha um modelo e introduza o seu URL

   Abra o editor, escolha um modelo e cole o endereço do seu site WordPress. O chatbot lê até 200 das suas páginas. Ainda não tem site? Introduza os dados do seu negócio à mão.

2. 2.

   Adicione conhecimento

   Carregue ficheiros (PDF, DOCX, PPTX, TXT, JSON, HTML, MD), escreva pares de perguntas e respostas para preços e políticas e adicione blocos de texto para tudo o que não está no site.

3. 3.

   Configure o agente

   Nome e imagem, função, tom (Amigável, Profissional, Descontraído, Direto ou o seu próprio), extensão das respostas, mensagem de boas-vindas e perguntas sugeridas, e regras de conversa sobre o que deve e não deve responder.

4. 4.

   Ative as competências

   Recolha contactos, envie uma mensagem de seguimento quando um visitante fica em silêncio, mostre botões de ação e ofereça os contactos da sua equipa quando o agente não conseguir ajudar.

5. 5.

   Combine com o seu tema

   Escolha um de seis temas, uma cor de destaque e um tipo de letra próximo do do seu tema WordPress.

Mais sobre cada passo em como adicionar um chatbot de IA ao seu site.

Adicione o chatbot a todas as páginas do WordPress

Um chat flutuante pertence, normalmente, a todas as páginas. Clique em Adicionar ao site no editor, copie o código e use uma destas opções:

1. 1.

   Um plugin de cabeçalho e rodapé

   Instale um plugin de fragmentos de código como o WPCode em Plugins → Add New, abra as definições de cabeçalho e rodapé, cole o código na caixa do rodapé e guarde. É a forma mais segura: sobrevive às atualizações do tema.

2. 2.

   O rodapé de um tema de blocos

   Aceda a Appearance → Editor → Patterns → Footer, adicione um bloco Custom HTML, cole o código e guarde.

3. 3.

   Uma área de widgets de um tema clássico

   Aceda a Appearance → Widgets (ou Customize → Widgets), adicione um widget Custom HTML a uma área do rodapé, cole o código e publique.

Para não mostrar o chat em algumas páginas — no checkout, por exemplo —, use as definições de visibilidade do chatbot em vez de remover o código.

Adicione o chatbot a uma página do WordPress

1. 1.

   Abra a página

   No WordPress, aceda a Pages, passe o rato sobre a página e clique em Edit.

2. 2.

   Adicione um bloco Custom HTML

   Clique em +, procure Custom HTML e coloque-o onde o chat deve aparecer. No editor clássico, mude antes para o separador Text.

3. 3.

   Cole o código e atualize

   Cole o código do chatbot e clique em Update. Um chat incorporado aparece nesse sítio; um flutuante abre a partir do canto apenas dessa página.

Os construtores de páginas funcionam da mesma forma: o widget HTML do Elementor, o módulo Code do Divi. Veja chatbot de IA para Elementor e chatbot de IA para WooCommerce para lojas.

WordPress.com ou WordPress.org?

Num site WordPress.org alojado por si, qualquer uma das formas acima funciona. No WordPress.com, adicionar scripts e plugins exige o plano Business ou superior; nos planos inferiores, o código é removido ou aparece como texto simples.

Onde mostrar o chatbot no seu site

• Páginas onde as pessoas ficam bloqueadas — as páginas de preços, contactos, produtos e checkout são onde surgem as dúvidas.

• O canto inferior direito é o habitual que os visitantes procuram; mova-o para a esquerda ou para o centro em baixo se tapar o carrinho ou o botão de cookies.

• Uma saudação e perguntas sugeridas funcionam melhor do que um simples botão: dizem aos visitantes o que o chat pode fazer.

• Um chat incorporado encaixa numa página de ajuda ou de contactos em que o chat é o conteúdo principal.

• Mostre ou oculte por página e dispositivo nas definições do chatbot, para que o mesmo código sirva todo o site.

Crie o seu próprio chatbot com a API da OpenAI

Se precisa de controlo total, pode criar um chatbot com a API de um modelo de IA. São precisas quatro peças:

1. 1.

   Uma chave de API

   Crie uma na plataforma para programadores do fornecedor e mantenha-a secreta — nunca a coloque no código da página.

2. 2.

   Um backend

   Um pequeno script de servidor que recebe a mensagem do visitante, chama a API e devolve a resposta. Precisa de alojamento e HTTPS.

3. 3.

   Uma interface de chat

   HTML e JavaScript para a janela do chat, adicionados através de um plugin de fragmentos de código ou de um bloco Custom HTML.

4. 4.

   O seu conhecimento

   À partida, o modelo não sabe nada sobre o seu negócio; tem de lhe fornecer o seu conteúdo e mantê-lo atualizado.

Também é você que mantém tudo: limites e custos da API, alterações de modelo, segurança, layout em dispositivos móveis. Para a maioria dos sites WordPress, um widget pronto a usar é mais rápido e mais barato de manter.

Dicas para um melhor chatbot no WordPress

• Treine-o com perguntas reais. Carregue as suas 20 perguntas mais frequentes com respostas, os preços e as políticas atuais e remova as versões desatualizadas.

• Dê-lhe uma voz. Defina o tom e adicione algumas regras de conversa para que soe como a sua marca e não como um bot genérico.

• Defina uma alternativa. Ofereça os contactos da sua equipa quando o agente não souber responder ou quando o visitante pedir uma pessoa.

• Leia as conversas. As conversas e os leads estão no seu painel e as transcrições podem ser enviadas para o seu e-mail — reveja-as todas as semanas e preencha as lacunas.

• Teste em telemóveis. Confirme que o lançador não tapa menus nem botões em ecrãs pequenos.

• Atualize a sua política de privacidade. Mencione o chatbot e os dados de contacto que recolhe, e indique no rodapé do chat que as respostas são geradas por IA.

Resolução de problemas

1. 1.

   O chatbot não aparece

   Confirme que o código está na página que está a ver e, depois, limpe a cache do plugin de cache e da CDN. Os plugins de otimização que atrasam ou combinam JavaScript podem bloqueá-lo — exclua deles o script do chatbot.

2. 2.

   O código aparece como texto

   Foi colado num bloco Paragraph ou no separador Visual. Use um bloco Custom HTML ou o separador Text do editor clássico; no WordPress.com, verifique o seu plano.

3. 3.

   Aparece em páginas onde não devia

   Defina regras de páginas nas definições de visibilidade do chatbot, ou passe o código do rodapé de todo o site para páginas individuais.

4. 4.

   As respostas estão erradas ou vagas

   Adicione os factos em falta como pares de perguntas e respostas ou blocos de texto, remova ficheiros contraditórios e torne as regras de conversa mais precisas.

Guia completo com capturas de ecrã: Adicionar o widget Elfsight ao WordPress ↗ · Prefere não ser você a fazê-lo? Peça a instalação gratuita ↗