Misión Widget de Webchat

Usa esta guía cuando quieres que visitantes inicien una conversación desde tu sitio web.

Widget de Webchat es una entrada conversacional dentro del sitio. En Hellotext se configura como misión y captura: controlas cómo aparece, cuándo se abre, qué dice primero y si los visitantes pueden continuar por otro canal como WhatsApp.

No es el agente de IA en sí. Piensa en el webchat como la puerta de entrada en tu sitio. Después de que una persona inicia una conversación, tu equipo, reglas del Inbox, misiones con IA o agentes personalizados pueden manejar el siguiente paso según tu configuración.

El editor agrupa los ajustes en tarjetas y muestra el preview del webchat a la derecha. Así puedes relacionar cada componente con la experiencia del visitante.

Tarjetas de Apariencia, Secuencia inicial, Teaser, Comportamiento y Canales; en la vista amplia, con el preview de Webchat a la derecha. — Vista general del editor. El foco para pantallas estrechas conserva las cinco tarjetas completas; el preview completo se muestra más abajo.

Widget de Webchat permite que clientes escriban a tu negocio directamente desde tu sitio.

Puede:

Mostrar un lanzador en las páginas donde instalas el widget.
Abrirse cuando el visitante hace click en el lanzador o, si lo configuras, después de cargar la página.
Mostrar un teaser corto antes de que la persona abra el chat.
Empezar con una secuencia inicial configurada.
Permitir que visitantes pidan ayuda, orientación sobre órdenes, recomendaciones de producto o soporte.
Enviar la conversación al Inbox cuando una persona necesita responder.
Continuar por WhatsApp cuando la derivación de canal está configurada.
Trabajar junto con misiones de IA, misiones de atención, agentes personalizados, rutas y reglas de respuesta.

Webchat funciona mejor cuando el sitio necesita una forma simple para que visitantes hagan preguntas sin salir de la página.

Cuándo usarlo

Usa Widget de Webchat cuando:

Los visitantes suelen necesitar ayuda antes de comprar.
Tu equipo quiere una entrada de chat visible en la tienda.
Quieres que preguntas de recomendación, soporte u órdenes empiecen desde el sitio.
Quieres invitar a visitantes a una conversación sin depender solo de SMS, WhatsApp o redes sociales.
Quieres que las conversaciones lleguen al Inbox con el proceso correcto del equipo.
Quieres ofrecer continuidad por WhatsApp después de que la persona empieza en el sitio.

Es especialmente útil combinado con Respuestas Instantáneas, Recomendador Inteligente, Seguimiento de Pedidos, Asistente de Cambios y Devoluciones, Asistente de Cancelación de Pedidos o un Agente Personalizado enfocado.

Cuándo no usarlo

No uses Widget de Webchat como reemplazo de todas las demás misiones.

Usa una campaña cuando necesitas un anuncio puntual a una audiencia seleccionada.

Usa una ruta cuando la experiencia del cliente debe seguir pasos, esperas, condiciones y asignaciones explícitas.

Usa una misión de producto o soporte con IA cuando el trabajo principal es el razonamiento del agente, no la entrada desde el sitio. Webchat puede iniciar la conversación, pero el agente igual necesita un objetivo, conocimiento y reglas de derivación propias.

Usa opt-in de checkout, formularios, códigos QR o links compartibles cuando el trabajo principal es recopilar consentimiento o datos del perfil en vez de iniciar un chat en el sitio.

Qué necesita antes de lanzarlo

Antes de habilitar Widget de Webchat, confirma:

Tu sitio web o plataforma de comercio está conectada, o sabes qué método de instalación vas a usar.
El método de instalación está listo: Hellotext.js, el plugin de WooCommerce o una integración compatible de VTEX o Fenicio.
Sabes en qué sitio y páginas vas a instalar el widget.
El equipo sabe quién se hace cargo de las nuevas conversaciones de webchat en el Inbox.
El mensaje inicial explica qué puede preguntar el visitante.
La derivación a WhatsApp está configurada si quieres que visitantes continúen por ese canal.
Las misiones con IA y los agentes personalizados que deberían responder conversaciones de webchat están listos.
Las reglas de respuesta y el horario comercial coinciden con el nivel de servicio que quieres para webchat.

Para validar la configuración, usa Verifica tus datos y señales después de configurar.

Qué puedes configurar

Abre Misiones, haz clic en Explorar misiones, busca el grupo Captura y elige Widget de Webchat. Si ya existe una misión de este tipo, se abre su editor.

Tarjeta Widget de Webchat del catálogo de misiones en escritorio. — Widget de Webchat en el catálogo de escritorio.

Widget de Webchat incluye:

Apariencia: color de marca, tipografía, lanzador, encabezado, colores de conversación, logo y marca Hellotext.
Comportamiento: ubicación, apertura por click o apertura automática, demora, comportamiento de primera visita y una vez por sesión.
Secuencia inicial: los primeros mensajes que se muestran en una nueva conversación de webchat.
Teaser: la invitación pequeña que aparece antes de que la persona abra el chat.
Canales o derivación: si se muestra WhatsApp, si se restringe la continuación a WhatsApp y qué número de WhatsApp se muestra.
Instalación: opciones de instalación automática o instrucciones manuales.

No necesitas personalizar todas las tarjetas. Empieza por las que definen la experiencia del visitante: apariencia, comportamiento, secuencia inicial y derivación.

Diseña la apariencia

El widget debería sentirse parte de tu sitio, pero seguir siendo fácil de encontrar.

Revisa:

Color del lanzador, color de texto, notificación e ícono.
Encabezado, nombre del negocio, logo y colores.
Fondo de conversación y colores de burbujas.
Colores de botones y carruseles cuando aparezcan.
Si tu plan permite remover la marca Hellotext.

Controles de marca de Webchat, con tipografía y color primario. — La marca define la tipografía y el color primario del widget.

El preview permite revisar juntos el encabezado, el saludo de la secuencia inicial, el campo de mensaje y el lanzador. Las burbujas de esta vista son ejemplos del editor.

Preview completo del Webchat de Tienda Ejemplo, con saludo, campo de mensaje y lanzador. — Webchat abierto en el preview, con un saludo ficticio que orienta al visitante.

Prueba en desktop y mobile. El lanzador no debería tapar botones de checkout, agregar al carrito, links de soporte, banners de cookies u otros controles importantes del sitio.

Elige el comportamiento con cuidado

Para un primer lanzamiento, usa apertura por click salvo que tengas una razón clara para abrirlo automáticamente.

En Comportamiento → Apertura, elige Automáticamente al cargar la página para ver la demora y los límites. Puedes abrir inmediatamente o después de 5, 10 o 30 segundos. Usa Solo en la primera visita y Una vez por sesión cuando corresponda; en el ejemplo, la apertura espera 5 segundos y ambos límites están marcados. La apertura automática también puede interrumpir la navegación.

Apertura automática y límites de primera visita y una vez por sesión. — El ejemplo espera 5 segundos. El foco móvil muestra los dos límites seleccionados.

La ubicación importa. Abajo a la derecha suele ser familiar para visitantes, pero usa la posición que no choque con el layout de tu tienda, navegación mobile o controles de checkout.

Escribe la secuencia inicial

La secuencia inicial debería ayudar al visitante a elegir qué hacer después.

Hazla corta:

Da la bienvenida.
Nombra las principales cosas que puede preguntar.
Ofrece uno o dos caminos útiles, como ayuda con una orden, recomendación de producto o hablar con una persona.
Evita textos largos de política en el primer mensaje.

Abre Secuencia inicial y escribe el saludo en el editor. Nuevo mensaje agrega otro mensaje a esa secuencia; también puedes definir retrasos y horarios. La vista previa refleja el texto que editas. Mantén el mensaje específico sin prometer que el webchat puede resolver todo por sí solo.

Configuración y vista previa del saludo ficticio de Webchat. — En escritorio se ve el editor; el foco móvil muestra el saludo en la vista previa, sin enviar mensajes.

Si una misión con IA o un agente personalizado va a responder después de que empieza la conversación, asegúrate de que la secuencia inicial coincida con el alcance real de ese agente.

Usa el teaser con intención

El teaser es el mensaje pequeño que invita al visitante a abrir el chat.

Úsalo para que el chat se sienta útil:

“¿Necesitas ayuda con el talle?”
“¿Quieres una recomendación de producto?”
“¿Tienes una pregunta sobre tu orden?”
“¿Necesitas ayuda antes de pagar?”

Evita textos que se sientan como un popup forzado o una promesa que tu equipo no puede cumplir.

En Teaser, activa Burbuja teaser para mostrar el mensaje pequeño. Activa Usar secuencia inicial personalizada si quieres definir un texto distinto de la secuencia inicial. Revisa ambos mensajes para evitar repeticiones.

Burbuja teaser activa y secuencia personalizada desactivada. — Con la burbuja activa y sin texto personalizado, el teaser usa la secuencia inicial.

Cuando Impulsor de Suscriptores está habilitado para Webchat y permite mostrar su teaser, puede reemplazar este mensaje con una invitación de suscripción para un visitante elegible. El incentivo depende de su configuración y del historial del perfil. Desactivar sólo su teaser no desactiva la invitación dentro del chat.

Configura la derivación de canal

En Canales, Mostrar ícono de WhatsApp agrega el acceso a ese canal. Restringir comunicación solo a WhatsApp cambia la experiencia a una entrada hacia WhatsApp. Selecciona el número correspondiente; el editor también permite escribir un número. El número ficticio del ejemplo no pertenece a un canal conectado y no se usa para enviar mensajes.

Ícono de WhatsApp activo con un número ficticio, sin restringir el chat a ese canal. — El número es ficticio. Mostrar el ícono y restringir el chat son opciones distintas.

Usa continuidad por WhatsApp cuando:

Los clientes pueden salir del sitio antes de que tu equipo responda.
Tu equipo prefiere continuar conversaciones largas en WhatsApp.
Los visitantes mobile tienen más probabilidad de responder desde WhatsApp que desde el navegador.
Quieres que el visitante vea un número específico de WhatsApp del negocio.

Ten cuidado con restringir la comunicación solo a WhatsApp. Usa esa opción cuando webchat debería funcionar principalmente como puerta hacia WhatsApp, no cuando quieres que visitantes sigan respondiendo en el sitio.

Si las conversaciones deberían asignarse a una persona o equipo, configura el camino de ownership en Inbox y revisa Derivación de IA al Inbox.

Instala y prueba

Abre el ícono de Configuración del editor para ver las opciones de instalación. Elige el método que coincide con tu sitio:

Instalación automática en VTEX o Fenicio, cuando la cuenta correspondiente está conectada.
Instalación manual en un sitio con Hellotext.js.
Instalación manual en WooCommerce con el plugin de Hellotext.

La instalación manual muestra el código y las instrucciones. En esta pantalla, Ya instalé mi código o Instalar y activar habilitan la misión y su flujo; no los uses hasta haber preparado el sitio. Una opción automática deshabilitada indica que falta conectar la plataforma. La vista previa del editor permite revisar la apariencia y los textos sin activar el widget.

Opciones de instalación de Webchat y descripción de la instalación manual con Hellotext.js. — En escritorio se ven los métodos disponibles; el foco móvil muestra la opción manual. No se instaló ni activó el widget.

Después prueba el sitio exacto donde debería aparecer el widget.

Revisa:

El widget carga en el sitio y las páginas donde lo instalaste.
El lanzador, teaser y secuencia inicial aparecen correctamente.
La apertura por click o automática se comporta como configuraste.
La demora, primera visita y una vez por sesión funcionan como esperas.
Los mensajes llegan al Inbox.
La asignación, ownership de equipo y reglas de respuesta se comportan como esperas.
La derivación o continuidad por WhatsApp usa el número correcto.
Las misiones con IA y los agentes personalizados conectados responden solo dentro de su alcance.
El widget funciona en desktop y mobile sin tapar controles importantes del sitio.

Qué revisar después del lanzamiento

Durante los primeros días, revisa:

Qué páginas inician más conversaciones de webchat.
Si los visitantes entienden la secuencia inicial.
Si el teaser atrae conversaciones útiles o genera ruido.
Si las conversaciones se responden suficientemente rápido.
Si las derivaciones llegan a la persona, equipo o número de WhatsApp correcto.
Si las misiones con IA responden correctamente o derivan cuando corresponde.
Preguntas repetidas que sugieren crear Respuestas Instantáneas, Asistente de Cambios y Devoluciones, Asistente de Cancelación de Pedidos, un Agente Personalizado, mejor contenido de políticas o mejor copy en el sitio.
Opt-ins, órdenes, ingresos atribuidos, salud de respuesta y respuestas perdidas cuando aplique.

Ajusta una parte por vez: ubicación, disparador, demora, teaser, secuencia inicial, derivación o la misión que responde después de que empieza la conversación.