Chatea con los visitantes con WebBlocks Live Chat

Utiliza un sitio de prueba y una cuenta Super admin para instalar plugins. El paquete publicado requiere PHP >=8.4 y CMS ^1.106.2; el catálogo indica Laravel ^13.0. Esa versión mínima del CMS inicia los canales de notificación y los componentes del panel del plugin instalado durante las solicitudes normales, también en servidores con rutas en caché. Revisa la compatibilidad de tu servidor antes de descargar el paquete del catálogo oficial de plugins.

Prepara una página accesible a los visitantes y una cuenta de operador con acceso a su sitio. Nuestra página ficticia es Talk to Northstar Studio, en /studio-help. Sus encabezados y tarjetas son bloques normales del CMS; no se inserta un bloque Live Chat. El plugin activado aporta el botón de apertura en las páginas públicas del sitio seleccionado.

Decide quién responderá y qué deben prometer los textos de disponibilidad. La disponibilidad es un ajuste manual de recepción: no detecta la presencia de operadores ni garantiza respuesta inmediata. Las respuestas normales aparecen en el widget. Esta versión desactiva los correos de respuesta al visitante, aunque este facilite una dirección.

1. Abre System → Plugins como Super admin.
2. Selecciona Browse Plugin Catalog y busca WebBlocks Live Chat.
3. Revisa la versión, el resultado de compatibilidad y las notas de publicación.
4. Usa Install from Catalog, abre los detalles instalados y selecciona Enable Plugin.
5. Si el administrador proporciona el archivo publicado de confianza, selecciónalo en Plugin ZIP, pulsa Upload Plugin ZIP, revisa el paquete instalado y actívalo.

El ejemplo utiliza el ZIP oficial publicado. Un plugin recién instalado empieza desactivado.

La instalación y activación actuales del CMS aplican los cambios de base de datos del plugin. Comprueba la versión esperada, el estado Enabled y que el almacenamiento esté preparado. Resuelve las advertencias de migración o compatibilidad antes de recoger mensajes. No consideres meramente estética una advertencia de superposición de un servidor antiguo: actualiza a un servidor compatible antes de desplegar esta versión.

Abre Open Settings o usa Live Chat → Live Chat Settings en la navegación. El encabezado identifica el sitio seleccionado. En una instalación multisitio, selecciona el sitio correcto antes de cambiar ajustes o abrir su bandeja.

Live Chat separa lectura, respuesta y configuración:

Concede acceso de lectura y respuesta a los operadores que contesten. Quien gestiona los ajustes también necesita lectura si trabaja en la bandeja. El acceso al sitio añade otra frontera: los permisos del plugin no abren las conversaciones de todos los sitios. Consulta Roles y permisos antes de modificar un rol compartido.

A diferencia de la lista de Support específica de cada solicitante, Live Chat es una bandeja para operadores del sitio. Los operadores autorizados pueden trabajar con las conversaciones de sus visitantes. Ten presente esta diferencia al dar acceso a conversaciones que pueden contener datos personales.

En Live Chat Settings → General settings, configura:

Selecciona Save settings en la tarjeta general. Activar el plugin y activar el widget público de un sitio son operaciones distintas.

La página también muestra la política de notificaciones heredada del sitio y el estado registrado del programador. Esos datos afectan al correo, no a la posibilidad de iniciar una conversación en línea. Configuraremos el correo después de comprobar los mensajes en ambas direcciones.

Desplázate a Language texts. Cada idioma activado del sitio tiene una pestaña. Para inglés, introduce:

Selecciona Save language texts en esta tarjeta. Es un formulario distinto de General settings: guardar textos conserva las opciones generales y guardar opciones generales conserva los textos. Comprueba el mensaje de éxito del formulario que realmente guardaste.

Repite el proceso para otros idiomas activos si es necesario. Cuando falta texto, se usa primero el idioma predeterminado y después los textos anteriores. Los títulos y etiquetas admiten hasta 120 caracteres; los mensajes localizados de bienvenida y sin conexión, hasta 500 caracteres. Si falta un idioma, actívalo antes con Añadir un idioma a un sitio.

Promete el canal que realmente ofreces. «Respondemos aquí» encaja con esta versión; «Te enviaremos la respuesta por correo» describiría incorrectamente la entrega al visitante.

Abre una página publicada del sitio configurado. En el ejemplo, Northstar muestra Chat with Northstar abajo a la derecha. El panel permanece cerrado hasta que el visitante selecciona el botón.

Los recursos públicos del plugin proporcionan el widget. No añades un script externo, no configuras una cuenta de chat alojado ni insertas un bloque de chat en cada página. Si falta el botón, comprueba la activación, el sitio seleccionado, el widget y que el diseño público cargue los recursos compatibles del CMS.

Prueba en una sesión de visitante adecuada. Live Chat limita por separado el inicio de conversaciones, el envío de mensajes y las consultas de actualización. Las consultas normales de notificaciones no consumen la cuota de inicio. Si aparece Too Many Attempts, deja de repetir envíos, espera a que termine la ventana normal del límite y vuelve a intentarlo una vez.

Selecciona el botón. El panel muestra el título y la bienvenida guardados. En el ejemplo en línea, escribe Ada en Your name, deja vacío Email (optional) y describe la consulta en How can we help?.

Selecciona Start conversation. El mensaje inicial aparece en el historial y el formulario se convierte en un campo de mensaje con Send.

Los nombres admiten hasta 100 caracteres, las direcciones de correo hasta 255 y los mensajes del visitante hasta 4 000. Escribe un primer mensaje breve y útil y evita datos confidenciales ajenos a la conversación de asistencia. Dar una dirección no habilita los correos de respuesta al visitante.

El navegador conserva una credencial privada para continuar el hilo. No es una sesión de operador. No la copies en capturas, URLs compartidas con compañeros ni notas de diagnóstico. Borrar el almacenamiento, cambiar de perfil o usar otro origen puede hacer perder el acceso al hilo; aquí no se ofrece una pantalla de recuperación por correo.

Abre Live Chat en el CMS y confirma el sitio que aparece bajo el encabezado. La bandeja muestra el estado del widget, la disponibilidad manual y vistas con contadores:

Ada aparece inicialmente con 1 unread y Awaiting reply. La lista muestra el último mensaje y ofrece View conversation.

El orden predeterminado de conversaciones abiertas prioriza las que esperan respuesta, empezando por el último mensaje más antiguo. También puedes elegir Latest message first u Oldest message first. La vista cerrada empieza por lo más reciente. Elige el orden adecuado para tu proceso, sin tomar la primera fila como una decisión automática de prioridad.

Abre el nombre de Ada o View conversation. Las burbujas del visitante aparecen a la izquierda y las del operador a la derecha, con separadores de día y horas de la zona horaria del sitio.

Leer al final de una conversación visible marca los mensajes del visitante como leídos. Vuelve a la bandeja antes de responder: Unread conversations está en cero, pero Awaiting reply sigue en uno. Abrir la conversación no respondió a Ada.

Al revisar mensajes antiguos, una llegada nueva no te desplaza forzosamente al final. New messages vuelve a los mensajes recientes. La bandeja y la conversación se actualizan cada cinco segundos cuando están visibles; las pestañas en segundo plano pausan las consultas y vuelven a comprobar al mostrarse. Son actualizaciones por consulta, no una conexión WebSocket ni un acuerdo de entrega instantánea garantizada.

Abre el hilo de Ada, escribe la respuesta en Reply y selecciona Send reply:

Comprueba Reply sent. y la burbuja del operador. Vuelve al widget del visitante y confirma que la respuesta aparece allí. Nuestro intercambio local real muestra ese mensaje en ambos lados.

La nota bajo el formulario es deliberada: Replies appear in the chat widget. No reply email is sent. Pide a los visitantes que mantengan disponible el mismo navegador o regresen a él. Una respuesta guardada del operador no demuestra entrega por correo.

Ada prepara un mensaje de seguimiento:

Cierra el widget con Close chat y ábrelo de nuevo. El borrador sin enviar permanece en el campo de mensaje. Cerrar el panel no equivale a que un operador cierre la conversación.

Selecciona Send cuando estés listo. El hilo vuelve a esperar respuesta porque el último mensaje ahora es del visitante. Mantén juntos los mensajes relacionados; una consulta nueva no exige otro hilo si el asunto actual sigue abierto.

Los operadores autorizados reciben una insignia de conversaciones no leídas en el enlace lateral Live Chat y en su grupo contraído. Un mensaje nuevo del visitante también puede mostrar un aviso genérico en el panel con View unread conversations, incluso mientras trabajas en otra sección del CMS. El aviso no contiene nombre, correo ni texto del visitante.

La primera consulta de notificaciones establece el estado actual; no vuelve a mostrar llegadas antiguas como avisos nuevos. Ver la conversación actual, ocultar una pestaña o abrir otra del panel también afecta a cuándo aparece un aviso. La insignia o el aviso no marca mensajes como leídos ni los responde. Son avisos internos, separados de los permisos del sistema operativo y del correo; usa las vistas de no leídos y pendientes para gestionar el trabajo real.

Busca workshop en la bandeja y selecciona Filter. La conversación de Ada coincide con un mensaje anterior aunque la vista previa más reciente ahora describa seis participantes y la orientación de marca.

La búsqueda incluye nombres de visitantes, correos e historial del sitio y la vista seleccionados. La fila sigue mostrando el último mensaje, sin sustituirlo por la coincidencia histórica. Los contadores se refieren al sitio, independientemente del texto buscado. Clear vuelve a la vista abierta y el orden predeterminados del sitio.

Usa Awaiting reply para trabajo sin contestar y Unread para mensajes aún no leídos. Ninguna vista sustituye un proceso acordado de tiempos de respuesta. Un compañero que abra un hilo puede cambiar su estado de lectura sin resolver la pregunta del visitante.

Cuando termine la conversación, ábrela y selecciona Close conversation. El operador verá Closed y la acción Reopen conversation en lugar del formulario habitual de respuesta.

El widget muestra This conversation is closed., desactiva las respuestas y ofrece Start a new conversation.

Iniciar otra conversación borra del navegador la credencial y el historial del hilo guardado y vuelve al formulario. Un mensaje sin enviar puede pasar a ese formulario. Es un hilo nuevo, no una forma de reabrir el original. El historial cerrado sigue disponible para operadores autorizados del sitio.

El operador puede seleccionar Reopen conversation. El hilo vuelve a estar abierto y el widget existente acepta respuestas tras su siguiente actualización.

Probamos cerrar y reabrir el mismo hilo. Reabrirlo no restaura una credencial ya borrada al iniciar otro hilo o eliminar el almacenamiento del navegador. Úsalo cuando tenga sentido continuar la conversación original y confirma que el visitante todavía puede acceder.

El correo es opcional e independiente del widget. Primero pide al administrador de alojamiento que configure el transporte de salida y la URL de confianza de la aplicación. El plugin usa la configuración de correo del CMS; no guarda credenciales SMTP nuevas en sus ajustes.

Abre Sites → Edit site → Contact y revisa Site message notifications. La política se aplica a canales participantes, incluido Live Chat. En la prueba local conservamos Alert only, elegimos Immediate y desactivamos Daily pending-message summary para no depender de una entrega programada.

Las opciones de contenido tienen efectos distintos:

• Alert only: recuentos mínimos y un enlace normal a la bandeja protegida; el aviso mínimo excluye nombres, direcciones, mensajes, URLs de origen y credenciales privadas de conversación.
• Full: incluye más información de la conversación y contenido del mensaje. Elígelo solo si resulta adecuado para tu organización y el destino de correo.

La frecuencia de entrega también se comparte:

Los resúmenes diarios siguen siendo mínimos aunque el contenido esté en Full. El resumen diario independiente de trabajo pendiente puede recordar mensajes no leídos o sin responder; también requiere programación. Guarda conscientemente la política, pues los demás canales participantes la heredan.

Vuelve a Live Chat Settings. Establece Availability en Offline, mantén activado Require email when offline y guarda. El widget sigue activo: Offline cambia la recepción; desactivar el widget elimina el botón público.

Si tu equipo quiere alertas por correo, activa Notify operators of offline messages, introduce el Offline notification recipient previsto y selecciona Save settings. Nuestra dirección studio@example.test es ficticia y solo la acepta el receptor local. Utiliza un buzón real de prueba bajo tu control para verificar tu propia entrega.

Si tienes permiso de gestión, también puedes usar el interruptor Availability de la bandeja. Guarda al instante y conserva los otros ajustes. No inicia sesiones del personal ni detecta si está presente. Sin JavaScript, usa el control Save adyacente o el formulario de ajustes.

Usa una conversación nueva en lugar de asumir que un cambio de ajustes modifica retroactivamente la recepción de un hilo existente. En el ejemplo se cierra el hilo anterior y el visitante selecciona Start a new conversation. El widget actualizado muestra el texto sin conexión y Email (required).

Introduce Robin, robin@example.test y una consulta breve. Ya no se admite dejar vacío el correo en esta nueva conversación sin conexión; la recepción en línea todavía permite omitirlo.

Envía una vez y revisa como operador la bandeja del sitio elegido. Abre el hilo de Robin, lee el mensaje y comprueba Offline operator notification. La prueba muestra Sent to mail transport, y el receptor SMTP local aceptó el aviso con la política guardada Alert only / Immediate y los resúmenes diarios desactivados. Esto confirma la entrega al transporte configurado, no la llegada a un buzón real. Las respuestas a Robin siguen publicándose en el widget, no por correo.

Si la entrega está en cola, comprueba primero la política heredada. Los lotes y trabajos diarios pueden esperar legítimamente. Si un aviso Immediate sigue pendiente, pide al administrador que verifique versiones compatibles, canal activado, destinatario y transporte de salida. Un mensaje ya inscrito para aviso sin conexión puede enviarse aunque la disponibilidad cambie a Online. Desactivar las notificaciones del canal o cerrar la conversación cancela lo pendiente. Los intentos fallidos o ambiguos no se repiten automáticamente; no prometas un correo entregado por cada mensaje guardado.

Live Chat Settings muestra evidencias de Scheduler and notification worker. Una tarea registrada no prueba que el programador del alojamiento funcione. El administrador o proveedor debe ejecutar la programación de Laravel cada minuto con el usuario de la aplicación y la versión CLI de PHP correspondiente. Sigue Notificaciones programadas y estado del programador.

Los avisos por lotes y diarios, así como los recordatorios diarios de trabajo pendiente, requieren esa conexión. Los avisos solo inmediatos con resúmenes diarios desactivados no la necesitan; insignias, avisos del panel y consultas normales del chat no dependen de un programador de correo.

El ejemplo local carece deliberadamente de programación de producción verificada. No presentamos una etiqueta sin verificar como éxito ni un envío manual como prueba de un cron operativo. Comprueba el correo real y la programación en tu alojamiento antes de depender de ellos.

Antes de invitar a visitantes reales, verifica sitio, textos, permisos y disponibilidad. Prueba un mensaje del visitante, una respuesta del operador, un seguimiento, la diferencia entre leído y pendiente y el cierre. Si usas recepción sin conexión, comprueba el correo obligatorio en un hilo nuevo y confirma que el destinatario previsto recibe un aviso real de prueba.

Mantén exactos los textos de disponibilidad, da a los operadores una rutina de gestión y explica al visitante dónde aparecerá la respuesta. Empieza por la referencia de Live Chat para los ajustes y la API o por Roles y permisos para delegar acceso sin dar configuración a todos los operadores.