Guía de integración

Cómo agregar un chatbot de IA a tu sitio web

Un widget de chat que responde a tus visitantes con la información de tus propios documentos, sin inventar y citando las fuentes. Lo instalas con una línea de código, sin programar.

¿Qué es el widget de chatbot?

Es un botón de chat flotante que se embebe en tu sitio web. Cuando un visitante pregunta algo, el agente busca la respuesta en los documentos que tú seleccionaste (manuales, pólizas, políticas, FAQs) y responde en lenguaje natural, citando de qué documento salió. No es un chatbot de reglas ni un ChatGPT genérico: responde únicamente con TU información, así que no inventa.

  • Entrenado con tus propios documentos (PDF y más)
  • Respuestas con la fuente citada
  • Se instala con una sola línea de código

Cómo funciona

Por dentro usa RAG (Retrieval-Augmented Generation): en vez de "saber" cosas de memoria, recupera los fragmentos relevantes de tus documentos y genera la respuesta a partir de ellos.

Recupera

Ante cada pregunta, busca los pasajes más relevantes entre los documentos que elegiste para el agente.

Responde con fuentes

Genera una respuesta en lenguaje natural basada solo en esos pasajes y muestra de qué documento proviene.

Aislado de tu sitio

El chat corre en un iframe seguro servido por nosotros: no toca el diseño ni el código de tu página.

Beneficios

Solo tus documentos

Eliges exactamente qué documentos alimentan al bot. Nada de tu biblioteca se expone por accidente.

Sin alucinaciones

Responde solo con lo que está en tus documentos y cita la fuente. Si no lo sabe, lo dice y ofrece tu correo de contacto.

Sin código

Configuras todo desde un panel y pegas una línea de código. No necesitas desarrolladores.

Control de dominios y costos

Decides en qué sitios funciona y cuántos mensajes consume. Sin sorpresas en la factura.

Cómo integrarlo en 3 pasos

  1. 1

    Sube tus documentos

    Carga los PDFs o documentos con la información que el bot debe conocer. Se indexan en segundos.

  2. 2

    Crea y configura tu agente

    Elige el nombre, los colores, el logo, el correo de contacto y los documentos que puede usar. Registra los dominios donde va a funcionar.

  3. 3

    Pega el snippet en tu sitio

    Copia la línea de código y pégala antes de </body>. El chat aparece flotando, listo para responder.

El código que pegas en tu sitio

<script
  src="https://asknorela.com/widget.js"
  data-asknorela-widget="wk_pub_TU_ID"
  data-position="bottom-left"
  async></script>

Reemplaza wk_pub_TU_ID por el identificador de tu agente (lo copias del panel). No es una clave secreta: es seguro tenerlo en tu HTML.

Ajustar la posición

Por defecto aparece en la esquina inferior derecha. Desde el panel tienes un selector visual de esquina que arma el código por ti; también puedes ajustarlo a mano con estos atributos del snippet:

  • data-position="bottom-right": abajo a la derecha (por defecto)
  • data-position="bottom-left": abajo a la izquierda
  • data-position="top-right": arriba a la derecha
  • data-position="top-left": arriba a la izquierda
  • data-offset-x / data-offset-y: separación en píxeles del borde horizontal y del vertical (default 20)
  • data-z-index: por si tu sitio tiene overlays que tapan el chat
  • data-lang="es" | "en": fuerza el idioma del widget (por defecto sigue al visitante)

Funciona en cualquier plataforma

HTML / cualquier CMS

Pega el snippet antes de </body>.

WordPress

En el footer del tema, o con un plugin tipo "Insert Headers and Footers".

Shopify

En theme.liquid antes de </body>, o vía una app de scripts.

Casos de uso

Soporte al cliente

Responde dudas frecuentes 24/7 con tu documentación real, y deriva al correo cuando no sabe.

Seguros y pólizas

"¿Qué necesito para contratar una póliza?" respondido al instante desde tus condiciones.

RRHH y onboarding

Un asistente interno que contesta sobre vacaciones, permisos y políticas desde el reglamento.

Documentación de producto

Convierte tus manuales en un asistente que guía a los usuarios paso a paso.

Seguridad y privacidad

Solo en tus dominios

El widget solo carga desde los dominios que registres; cualquier otro origen es rechazado.

Sin captura de datos

No hacemos lead capture. El único correo que se muestra es el de contacto que tú configures.

Datos aislados

Tu documentación queda aislada por organización; el bot solo accede a lo que seleccionaste.

Preguntas frecuentes

¿Necesito saber programar para agregar el chatbot?+

No. Configuras todo desde un panel visual y solo pegas una línea de código <script> en tu sitio. Si usas WordPress o Shopify, hay opciones sin tocar código.

¿En qué plataformas funciona?+

En cualquiera que te deje insertar una etiqueta <script>: HTML plano, WordPress, Shopify, Webflow, Wix y la mayoría de los CMS.

¿El chatbot puede inventar respuestas?+

No. Responde solo con la información de los documentos que seleccionaste y cita la fuente. Si la respuesta no está, lo dice y ofrece tu correo de contacto.

¿Cómo controlo dónde y cómo aparece?+

Eliges una de las cuatro esquinas (arriba o abajo, izquierda o derecha) desde el selector visual del panel (que arma el código por ti) o con el atributo data-position del snippet. La separación de los bordes se ajusta con data-offset-x y data-offset-y, y registras los dominios permitidos. En móvil pasa a pantalla completa automáticamente.

¿Puedo cambiar los documentos o el diseño después de publicar?+

Sí. Editas el agente desde el panel cuando quieras (documentos, colores, logo, mensaje de bienvenida, idioma o dominios) y los cambios se aplican al instante, sin volver a tocar el código de tu sitio.

¿El widget hace más lento mi sitio?+

Casi nada. El script es liviano y se carga de forma asíncrona, y el chat vive en un iframe aislado que solo se carga cuando el visitante abre el botón. No afecta el diseño ni los estilos de tu página.

¿En qué idioma responde el agente?+

En español o inglés. Puedes fijarlo en la configuración o dejarlo en automático para que siga el idioma del navegador de cada visitante.

¿Cuánto cuesta?+

Puedes empezar gratis. Tu plan incluye una cuota mensual de mensajes del agente, y hay un límite por visitante para evitar abuso.

¿Captura datos de mis visitantes?+

No. No hacemos captación de leads ni guardamos datos personales del visitante; solo mostramos tu correo de contacto como alternativa.

¿Quieres saber más sobre el agente para tus clientes? Conocé el agente de IA empresarial →

Transforma la Gestión del Conocimiento de tu Empresa

Empieza hoy con AskNorela y descubre cómo la IA privada puede revolucionar la productividad de tu equipo.