Saltar al contenido principal
El widget web permite a los visitantes interactuar con tu agente de IA a través de voz, chat o ambos al mismo tiempo. Configura todo a través del editor visual—sin necesidad de programar—luego copia y pega un único script de integración.

​
Crea tu Widget

Diálogo Crear Widget mostrando campo Nombre del Widget con texto de marcador 'Ingresa nombre del widget', menú desplegable Agente para seleccionar qué agente alimenta el widget, botones Cancelar y Crear Widget
Diálogo Crear Widget mostrando campo Nombre del Widget con texto de marcador 'Ingresa nombre del widget', menú desplegable Agente para seleccionar qué agente alimenta el widget, botones Cancelar y Crear Widget
1

Abre el gestor de widgets

Navega a Web → Widgets en el panel de control
2

Crea un nuevo widget

Haz clic en Crear Widget y proporciona:
  • Nombre del widget - Etiqueta interna para tu referencia
  • Agente - Selecciona qué agente alimenta este widget
3

Configura el widget

Usa las pestañas del editor visual para personalizar tu widget (ver secciones abajo)
4

Guarda tus cambios

Haz clic en Guardar Cambios en la parte inferior derecha para persistir todas las actualizaciones
5

Obtén el código de integración

Ve a la pestaña Exportar y copia tu script único de integración

​
Pestañas de Configuración

El editor de widgets incluye seis pestañas a la izquierda con una vista previa en vivo a la derecha que se actualiza mientras realizas cambios.
Interfaz de configuración de widget mostrando barra lateral izquierda con pestañas Configuración, Apariencia, Contenido, Funciones, Acciones, Privacidad y Exportar, panel de configuración principal con campo Nombre del Widget, menú desplegable Agente, campo Nombre Visible y entrada Dominios Permitidos, panel de vista previa en vivo a la derecha mostrando la apariencia del widget
Interfaz de configuración de widget mostrando barra lateral izquierda con pestañas Configuración, Apariencia, Contenido, Funciones, Acciones, Privacidad y Exportar, panel de configuración principal con campo Nombre del Widget, menú desplegable Agente, campo Nombre Visible y entrada Dominios Permitidos, panel de vista previa en vivo a la derecha mostrando la apariencia del widget
  • Nombre del widget - Etiqueta interna mostrada en tu lista de widgets
  • Agente - Cambia a un agente diferente en cualquier momento
  • Nombre visible - Nombre de cara al cliente mostrado en el widget
  • Dominios permitidos - Restringe dónde puede cargarse el widget (deja vacío para permitir todos los dominios)
Temas Predefinidos
  • Comienza desde paletas de colores seleccionadas
  • Desplázate por las opciones predefinidas
Diseño
  • Posición: inferior izquierda o inferior derecha
  • Tamaño del widget y desplazamientos desde los bordes
  • Estado inicial: colapsado, expandido o siempre abierto
Avatar
  • Efecto animado “Pulso IA”
  • Sube imagen personalizada
  • Enlaza a URL de imagen externa
Colores y Gradientes
  • Fondos y colores de CTA
  • Estilo de burbujas de transcripción
  • Colores de estado y gradientes del orbe
Radio de Borde
  • Redondez del botón de lanzamiento
  • Esquinas de la ventana de chat
  • Burbujas de mensajes
  • Campo de entrada y botón CTA
Animaciones
  • Efecto opcional de ondulación o vibración en el botón de llamada
Idiomas Predefinidos
  • Paquetes preconfigurados de inglés y alemán
  • Establece todas las etiquetas del widget y texto legal
Mensajes de Bienvenida
  • Texto del mensaje de bienvenida
  • Texto de marcador de posición
  • Mensajes de estado (escuchando, hablando, pensando, conectando)
Texto de Retroalimentación
  • Mensaje de retroalimentación
  • Texto del botón de envío
  • Mensaje de agradecimiento
Sobrescritura de Etiquetas
  • Personaliza cadenas de UI individuales
  • Grupos: Chat, Controles, Transcripción, Audio, Accesibilidad
  • Modo solo chat - Deshabilita voz, solo chat
  • Permitir texto durante llamada - Mantiene entrada de texto activa durante llamadas de voz
  • Alternar transcripción - Mostrar/ocultar transcripción en vivo
  • Control de silencio - Mostrar botón de silencio para permitir al usuario silenciar su micrófono
  • Temporizador de llamada - Mostrar tiempo transcurrido
  • Marca - Mostrar/ocultar “Powered by itellicoAI”
  • Omitir saludo - Evitar saludo si el usuario escribe primero
  • Recopilación de retroalimentación - Habilitar retroalimentación post-llamada (no almacenada aún, próximamente)
Configura herramientas del lado del cliente que tu agente puede invocar durante conversaciones para mostrar enlaces, abrir páginas o activar llamadas telefónicas en el navegador del usuario.
Herramientas del Cliente: A diferencia de las acciones API que se ejecutan en tu servidor, las herramientas del cliente se ejecutan directamente en el navegador del usuario. El LLM decide cuándo llamar a estas herramientas basándose en el contexto de la conversación y la descripción del disparador que proporcionas.
Agrega hasta cinco herramientas del cliente:
  • Texto del botón - Etiqueta mostrada al usuario (ej., “Ver precios”, “Llamar a soporte”)
  • URL - Enlace web (https://) o número telefónico (tel:)
  • Disparador - Describe cuándo el agente debe invocar esta herramienta (ej., “Cuando el usuario pregunte sobre precios”, “Cuando el usuario quiera hablar con un humano”)
  • Comportamiento:
    • Auto-clic - Abre automáticamente el enlace cuando se invoca la herramienta
    • Esperar respuesta - Muestra el botón y espera a que el usuario haga clic (con tiempo de espera opcional)
    • Terminar llamada al hacer clic - Termina automáticamente la conversación después de que el usuario haga clic
Los enlaces de número telefónico (tel:) terminan automáticamente la llamada después de que el usuario hace clic.
Términos y Privacidad
  • Editor Markdown para texto legal personalizado
  • Texto predeterminado proporcionado para nuevos widgets
Configuración de Consentimiento
  • Etiquetas de botones aceptar/rechazar
  • Clave de almacenamiento local para recordar consentimiento
  • Requerir consentimiento antes de activación
Crea enlaces demo compartibles para stakeholders, clientes o miembros del equipo para probar tu widget sin incrustarlo en un sitio web.Creando Enlaces para Compartir
  • Haz clic en Crear Enlace para generar una URL de página demo
  • Opcionalmente agrega un nombre para identificar el enlace
  • Establece expiración: 24 horas, 7 días, 30 días, nunca o fecha personalizada
  • Limita los demos máximos si es necesario
Gestionando Enlaces
  • Ve todos los enlaces compartidos existentes con fecha de creación y expiración
  • Rastrea conteo de demos y estadísticas de vistas
  • Edita configuración del enlace (nombre, expiración, demos máximos)
  • Elimina enlaces que ya no son necesarios
Notas de Seguridad
  • Los enlaces compartidos son públicamente accesibles—trátalos como contraseñas
  • Establece fechas de expiración para acceso temporal
  • Usa límites de demo para pruebas controladas
  • Elimina enlaces cuando ya no los necesites
Script de Integración
  • URL de carga única para tu widget
  • Copia y pega antes de la etiqueta </body>
Guías de Instalación
  • Instrucciones paso a paso
  • Consejos específicos por plataforma:
    • Google Tag Manager
    • WordPress
    • Webflow
    • Shopify
    • Wix
    • Squarespace

​
Despliega tu Widget

1

Prueba en la vista previa

Usa la vista previa en vivo en el lado derecho del configurador para probar tu widget. Haz clic en el ícono de actualización si es necesario.
2

Copia el script de integración

Ve a la pestaña Exportar y copia tu script único de integración.
3

Agrega a tu sitio web

Pega el script justo antes de la etiqueta de cierre </body> en tu sitio web.
4

Pruébalo en vivo

Carga tu sitio, haz clic en el widget y prueba una conversación de voz o chat. Verifica Conversaciones para confirmar que la sesión fue registrada.
Los cambios de configuración que realizas en el panel de control se aplican automáticamente a tu widget integrado. No necesitas actualizar el script de integración. Si los cambios no aparecen inmediatamente, haz una recarga forzada (Ctrl+Shift+R o Cmd+Shift+R).
Notas:
  • Restricciones de dominio se aplican inmediatamente. Si están configuradas, el widget solo se carga en dominios permitidos.
  • HTTPS requerido para acceso al micrófono (excepto localhost).
  • Responsivo en móvil - El widget se adapta automáticamente a pantallas móviles.
  • Crea widgets separados para diferentes sitios o necesidades de marca.

​
Solución de Problemas

  • Verifica la consola del navegador para errores de JavaScript
  • Verifica que los dominios permitidos incluyan tu sitio
  • Asegúrate de que el script esté colocado antes de la etiqueta </body>
  • Verifica la configuración de Content Security Policy
  • HTTPS requerido (excepto localhost)
  • El usuario debe otorgar permiso manualmente
  • Verifica la configuración del micrófono del navegador
  • Algunos navegadores bloquean en la primera visita
  • WebRTC requiere puertos UDP abiertos
  • Las VPNs corporativas pueden bloquear WebRTC
  • Prueba desde una red diferente
  • Verifica las estadísticas WebRTC del navegador en chrome://webrtc-internals
  • Haz clic en Guardar Cambios en el configurador
  • Recarga forzada de tu sitio (Ctrl+Shift+R o Cmd+Shift+R)
  • Limpia el caché del navegador si es necesario
  • Verifica que estás editando el widget correcto

​
Próximos Pasos

Mejores Prácticas de Producción

Aprende cómo mantener y escalar tu despliegue de widget

Optimizar Conversión

Mejora el engagement y la experiencia del usuario