IdiomaENES
WidgetsDisponible en Starter

Widgets e instalación

Las seis superficies, la etiqueta de script, los dominios permitidos y qué revisar si no aparece.

Actualizado 2026-09-09Ver .md

Elegir la superficie

Son seis. Lo que separa una de otra es dónde aparece en tu página y cómo se abre, así que elige por eso y no por el nombre.

  • Chat flotante. Una burbuja en la esquina que abre un panel. Lo normal para una web de marketing.
  • Chat embebido. El mismo panel, siempre abierto, dentro del elemento que elijas. Para una página de ayuda.
  • Destacado. Una caja de pregunta grande, la de la propia página. La respuesta llega en la misma tarjeta, y las acciones rápidas van debajo como pastillas.
  • Campo en línea. Un campo del ancho de lo que lo contiene. Sus acciones rápidas se abren debajo como un panel con un icono y una línea de descripción en cada una, filtradas mientras se escribe.
  • Asistente de documentación. Un cajón que entra desde el borde derecho sobre una página de documentación, con citas que enlazan dentro de ella.
  • Página alojada. Una página completa en tu propia dirección, cuando no tienes dónde embeber. Su cabecera lleva tu logo y el nombre de tu espacio de trabajo.

El chat flotante y el chat embebido están en todos los planes. Las otras cuatro necesitan Pro.

Destacado y Campo en línea responden una pregunta y vuelven a empezar, y por eso son las dos que no ofrecen un formulario de contacto preguntado a lo largo de varios turnos.

Destacado y Campo en línea

Las dos se configuran en la pestaña Diseño del widget, y las dos ofrecen lo mismo:

  • Un texto de ayuda que rota. Hasta ocho frases; cada una se escribe sola, se mantiene y se borra. Apagado hasta que agregues una frase. Quien pide movimiento reducido en su sistema ve la primera frase quieta, y eso no es un ajuste que ninguno de los dos pueda anular.
  • Acciones rápidas, que se editan en la pestaña Comportamiento. Cada una lleva una etiqueta, una pregunta que se envía y, si quieres, una descripción y un icono: uno de doce, o un PNG, JPG o SVG propio. El campo en línea dibuja las tres cosas; Destacado dibuja pastillas, y una pastilla es una etiqueta, así que ahí no se usan ni la descripción ni el icono.

Destacado tiene una más: un degradado suave detrás de la tarjeta, mezclado con tu color Primario y un color de Brillo. El campo en línea se dibuja sobre una superficie plana, así que no lee ninguno de los dos.

Idioma

Dos idiomas, y dos preguntas distintas.

La interfaz se define en la pestaña Comportamiento: inglés, español o Detectar, que sigue al navegador de quien visita y usa español cuando está en español e inglés en cualquier otro caso. Son las palabras del propio widget: el texto de ayuda, los botones de enviar y cerrar, la línea de que está escribiendo, las etiquetas del formulario de contacto, la línea de Con tecnología de. Si tu embed nombra un idioma con data-locale="es", ese gana sobre los tres: una página en español dentro de un sitio en inglés debe seguir en español, sea cual sea el portátil de quien lee.

Las respuestas no son este ajuste. Al asistente se le indica responder en el idioma en que escribe quien pregunta, así que una pregunta en español recibe una respuesta en español aunque la interfaz del widget esté en inglés, y las sugerencias de seguimiento vuelven en ese mismo idioma. No tienes que elegir un idioma para tus clientes: eliges uno para los botones que los rodean.

Instalar

Copia la etiqueta de script desde la pestaña Instalar del widget y pégala justo antes del cierre del body.

html
<script src="https://cdn.welcomeai.dev/widget.js" data-widget="wg_xxxxxxxxxxxx" async></script>

No hace falta nada más. El widget carga de forma asíncrona y no bloquea tu página.

Dominios permitidos

Un widget solo responde en los dominios que listes. Añade todos, incluido el de pruebas. *.example.com cubre los subdominios. Una petición desde cualquier otro sitio se rechaza, y eso es lo que impide que alguien se lleve tu clave y monte tu asistente en su web.

No aparece nada

Revisa en este orden:

  1. Esta publicado el widget? Un widget en borrador no carga.
  2. Esta permitido el dominio? La consola del navegador muestra el rechazo con el origen que vimos.
  3. ¿Está el script en la página? Mira el código fuente y busca data-widget.
  4. Lo bloquea algo? Una política de seguridad estricta necesita permitir cdn.welcomeai.dev.

La página del widget muestra los dominios donde se ha visto y cuándo, que suele resolver la duda más rápido que la consola.

Widget de chat React para tu aplicaciónUn provider, un componente, un hook