Para programadores

Componente de chatbot de IA para React

Adicione um chatbot de IA a uma aplicação React sem ter de o construir: renderize um componente e treine e estilize o agente no editor da Elfsight. Ou construa o seu — eis como se comparam os dois caminhos.
Sem cartão de crédito
Ver o código ↓
Componente de chatbot de IA para React
React
// npm install react-elfsight-widget
import { ElfsightWidget } from "react-elfsight-widget";

export function AiChatbot() {
  return <ElfsightWidget widgetID="YOUR-WIDGET-ID" />;
}

// The component adds Elfsight's platform.js for you —
// and won't add it twice if it's already on the page.

Crie gratuitamente o seu agente de IA

  1. 1. Introduza o seu website
  2. 2. Dê forma ao seu agente
  3. 3. Adicione ao website
Construir ou incorporar

Construir você mesmo um chatbot de IA em React

Um chatbot de IA é mais do que uma janela de chat e uma chamada a uma API de modelo. Eis o que é preciso para o manter bem — e o que pode dispensar.

O que teria de construir e manter

Um modelo e a sua fatura

Escolher um modelo, lidar com limites de pedidos e ver os custos de tokens crescerem com o tráfego.

O seu conteúdo como respostas

Rastrear o site, dividi-lo e incorporá-lo e manter o índice sincronizado quando as páginas mudam.

A interface do chat

Balões, respostas em streaming, pontos de escrita, disposição móvel e acessibilidade em todas as páginas.

Memória da conversa

Guardar a conversa de cada visitante e devolver o contexto certo dentro do limite de tokens.

Salvaguardas

Manter as respostas no tema, evitar factos inventados e decidir o que nunca deve dizer.

Leads e transferência

Formulários no chat, consentimento e encaminhamento das conversas certas para uma pessoa.

Transcrições e análises

Guardar conversas, enviá-las à equipa por e-mail e ver o que os visitantes perguntam.

Manutenção

Atualizações de modelos, ajuste de prompts, correções de segurança — e alguém de prevenção quando avaria.

Com a Elfsight: um componente

Crie e treine o agente no editor da Elfsight e depois renderize um componente. As respostas, os leads e as definições vivem no seu painel — sem novo deploy para os alterar.
React
<AiChatbot />
  • Aprende automaticamente com o seu website

  • Formulários de leads e transferência para humano integrados

  • Histórico de conversas, transcrições e análises

  • Flutuante ou incorporado, estilizado no editor

  • Plano gratuito, sem cartão de crédito

Integração

Adicione o chatbot de IA a React

  • Componente oficial. react-elfsight-widget do npm — o mesmo componente que o suporte da Elfsight recomenda para aplicações React.

  • Flutuante ou incorporado. Um chat flutuante vai uma só vez no seu componente raiz e aparece em todas as páginas; um incorporado fica onde o renderizar.

  • Vite, CRA, Gatsby, Remix. Um componente React normal com uma única propriedade: widgetID.

React
// npm install react-elfsight-widget
import { ElfsightWidget } from "react-elfsight-widget";

export function AiChatbot() {
  return <ElfsightWidget widgetID="YOUR-WIDGET-ID" />;
}

// The component adds Elfsight's platform.js for you —
// and won't add it twice if it's already on the page.
Pronto a usar

O que o agente faz sem código seu

Cria-se a partir do seu site

Analisa o seu site para compreender o seu negócio, produtos, serviços e conteúdo, e transforma-o automaticamente num agente de IA.

Cria uma base de conhecimento

Transforma automaticamente o conteúdo do seu site em respostas de IA precisas.

Define uma personalidade

Cria um nome, ícone, função e tom de voz com base no seu negócio.

Prepara a primeira interação

Gera mensagens de boas-vindas e respostas rápidas pensadas para os seus visitantes e objetivos de negócio.

Equipa-se com as competências certas

Adiciona automaticamente captação de leads, botões de ação e outras capacidades com base no seu negócio.

Aprende com as conversas

Deteta conhecimento em falta e ajuda a melhorar as conversas futuras ao longo do tempo.
Comparar

AI Chatbot da Elfsight vs construir sobre uma API de modelo em React

Funcionalidade
Elfsight AI Chatbot
A sua própria solução
Tempo até ao lançamento
Minutos: um componente
Semanas de engenharia
Conhecimento
Criado automaticamente a partir do seu website
Rastrear, incorporar e sincronizar por si
Interface do chat
Pronta, estilizada no editor
Construir, testar e manter
Leads e transferência
Formulários de leads e transferência para humano incluídos
Construir formulários, consentimento e encaminhamento
Transcrições e análises
Painel, transcrições por e-mail e relatórios
Construir o armazenamento e os relatórios
Custos
Um plano, com um gratuito para começar
Tokens do modelo, alojamento e o tempo da sua equipa
Manutenção
A Elfsight mantém-no a funcionar
A sua equipa

Tempo até ao lançamento

AI Chatbot

Minutos: um componente

A sua própria solução

Semanas de engenharia

Conhecimento

AI Chatbot

Criado automaticamente a partir do seu website

A sua própria solução

Rastrear, incorporar e sincronizar por si

Interface do chat

AI Chatbot

Pronta, estilizada no editor

A sua própria solução

Construir, testar e manter

Leads e transferência

AI Chatbot

Formulários de leads e transferência para humano incluídos

A sua própria solução

Construir formulários, consentimento e encaminhamento

Transcrições e análises

AI Chatbot

Painel, transcrições por e-mail e relatórios

A sua própria solução

Construir o armazenamento e os relatórios

Custos

AI Chatbot

Um plano, com um gratuito para começar

A sua própria solução

Tokens do modelo, alojamento e o tempo da sua equipa

Manutenção

AI Chatbot

A Elfsight mantém-no a funcionar

A sua própria solução

A sua equipa

Perguntas frequentes