🌐 Cómo crear y configurar un Chat-Web

P

Pablo

Última actualización el Aug 3, 2026

El canal de Sitio Web le permite agregar un chat en vivo a su página web para que los visitantes puedan escribirle directamente desde allí 💬. Los mensajes ingresan a la bandeja de entrada de Chatealo, donde su equipo puede responderlos junto con los del resto de los canales.


🧠 ¿Qué aprenderá con este tutorial?

  • 📥 Cómo crear una bandeja de entrada de Sitio Web.

  • 🎨 Cómo personalizar la apariencia y los textos del chat.

  • 🧩 Cómo instalar el código del chat en su página web.

  • ✅ Cómo probar que el chat funcione.

  • 🗑️ Cómo eliminar el canal.

🎯 ¿Qué logrará?

  • Atender a los visitantes de su web en tiempo real.

  • Responder desde una bandeja compartida con su equipo.

  • Asignar conversaciones a sus agentes.

  • Centralizar el chat de la web junto con WhatsApp, Email y los demás canales.

  • Tener historial y seguimiento de cada conversación.


📂 Paso 1: Abra la sección de Entradas

  1. Inicie sesión en Chatealo.

  2. En el menú lateral izquierdo, haga clic en Ajustes ⚙️.

  3. Seleccione Entradas.

  4. Haga clic en Añadir bandeja de entrada (esquina superior derecha).


🌐 Paso 2: Seleccione el canal Sitio Web

Chatealo mostrará los distintos tipos de canales disponibles.

Seleccione la opción Sitio Web y haga clic sobre ella para comenzar la configuración 💬.


⚙️ Paso 3: Configure el chat

En esta pantalla definirá cómo se verá y cómo se identificará el chat en su sitio web. Complete los siguientes campos:

  • 🏷️ Nombre del sitio web ⇾ es el nombre interno con el que identificará este canal dentro de Chatealo. Por ejemplo: Chat Web Soporte.

  • 🌍 Dominio del sitio web ⇾ la dirección de su sitio, sin https://. Por ejemplo: miempresa.com.

  • 🎨 Color del widget ⇾ el color que tendrá el botón del chat en su página. Se recomienda utilizar el color principal de su marca.

  • 💬 Cabecera de bienvenida ⇾ el título que verá la persona al abrir el chat. Por ejemplo: ¡Hola! Estamos para ayudarlo.

  • 📝 Subtítulo del widget (Tagline) ⇾ un texto secundario, más breve, que orienta al visitante. Por ejemplo: Escríbanos su consulta y le respondemos a la brevedad.

  • 👋 Habilitar bienvenida al canal ⇾ permite enviar automáticamente un saludo cuando se inicia una conversación nueva. Puede dejarlo deshabilitado por ahora y activarlo más adelante.

Para finalizar, haga clic en Crear bandeja de entrada

⚠️ Sobre el dominio: ingréselo correctamente, ya que Chatealo lo utiliza para identificar desde qué sitio llegan las conversaciones.


👥 Paso 4: Asigne los agentes

Chatealo le pedirá que seleccione los agentes que podrán responder los mensajes que lleguen desde el sitio web 🧑‍💻.

Selecciónelos y haga clic en Añadir agentes.

👉 Solo estos agentes podrán ver y responder las conversaciones de esta bandeja. Si no asigna a nadie, únicamente los administradores las visualizarán.

💡 Los agentes son las personas de su equipo que atienden las conversaciones dentro de Chatealo. Un agente puede responder, asignar y resolver conversaciones. Esta configuración se puede modificar en cualquier momento desde la pestaña Colaboradores.



✅ Paso 5: Finalice la creación

Una vez asignados los agentes, Chatealo mostrará una pantalla de finalización.

Su canal de Sitio Web ya está creado. Ahora falta instalar el chat en su página para que los visitantes puedan verlo.


🧩 Paso 6: Instale el chat en su sitio web

Este es el paso que hace visible el chat en su página. Sin él, el canal existe dentro de Chatealo pero los visitantes no lo ven.

📍 Dónde encontrar el código

  1. Ingrese a Ajustes ⚙️ ⇾ Entradas.

  2. Seleccione la bandeja de sitio web que acaba de crear.

  3. Seleccione la pestaña "Configuración de Sesión" y ubique el bloque con el código de instalación (Script de Messenger un texto que comienza con <script>).

  4. Haga clic en el ícono de copiar 📋 para copiarlo completo.

⚠️ Copie el código completo, incluyendo la etiqueta de apertura <script> y la de cierre </script>.

💻 Dónde pegar el código

El código debe colocarse antes de la etiqueta de cierre </body> y en todas las páginas donde quiera que aparezca el chat.

Según cómo esté hecho su sitio:

  • WordPress ⇾ puede pegarlo mediante un complemento de inserción de scripts, o en el archivo footer.php de su tema. Se recomienda utilizar un complemento para que el código no se pierda al actualizar el tema.

  • Shopify, Wix, Tiendanube u otra plataforma ⇾ busque la sección de código personalizado o scripts de terceros dentro de la configuración de su tienda, y péguelo allí.

  • Google Tag Manager ⇾ cree una etiqueta de tipo HTML personalizado, pegue el código y active el disparador en todas las páginas.

  • Sitio web a medida ⇾ entregue el código a la persona que administra su sitio, indicándole que debe insertarlo antes del cierre de </body>.

📌 Si no maneja la parte técnica de su web, no modifique archivos por su cuenta. Envíele el código a su desarrollador o contacte a nuestro equipo de soporte.


✅ Paso 7: Pruebe el canal

Para confirmar que quedó todo bien conectado:

  1. Abra su sitio web en el navegador.

  2. Actualice la página con la tecla F5.

  3. Verifique que el botón del chat aparezca (habitualmente en la esquina inferior derecha).

  4. Haga clic en el botón y envíe un mensaje de prueba.

  5. Vuelva a Chatealo e ingrese a Conversaciones.

  6. El mensaje debe aparecer en la bandeja del canal de sitio web.

Si el mensaje llega correctamente, el canal ya está funcionando 🎉

💡 Si no ve el botón del chat, pruebe abrir su sitio en una ventana de incógnito. En ocasiones el navegador conserva en memoria una versión anterior de la página.



⚙️ Configuración adicional recomendada

Una vez creado el canal, puede mejorar la experiencia de atención desde Ajustes ⚙️ ⇾ Entradas ⇾ seleccionar la bandeja:

  • 👤 Avatar del canal ⇾ agregue un logo o imagen identificatoria.

  • 🏷️ Nombre de la bandeja ⇾ modifíquelo para identificarla mejor.

  • 🔄 Enrutamiento de conversaciones ⇾ defina si se reabre una conversación anterior o se crea una nueva.

  • 🧢 Nombre del agente visible ⇾ muestre al cliente quién le responde.

  • Encuesta de satisfacción (CSAT) ⇾ envíe encuestas al finalizar las conversaciones.

Recuerde hacer clic en Actualizar para guardar los cambios.


🗑️ Cómo eliminar el canal de Sitio Web

  1. Ingrese a Ajustes ⚙️ ⇾ Entradas.

  2. Seleccione la bandeja de sitio web que desea eliminar.

  3. Haga clic en Eliminar 🗑️ y confirme la acción.

⚠️ Importante: al eliminar la bandeja, el chat dejará de funcionar. La acción no se puede deshacer y puede afectar la atención si el canal está en uso.

💡 Recuerde además quitar el código del widget de su sitio web. De lo contrario, el botón de chat puede seguir apareciendo sin funcionar.


⚠️ Problemas comunes

  • El chat no aparece en el sitio web ⇾ el código no fue instalado, o se pegó en una sola página. Verifique que esté antes del cierre de </body> en todas las páginas.

  • El chat aparece pero los mensajes no llegan a Chatealo ⇾ el código se copió de forma incompleta. Cópielo nuevamente completo desde la configuración de la bandeja.

  • Nadie ve las conversaciones ⇾ no se agregaron agentes a la bandeja. Asígnelos desde la pestaña Colaboradores.

  • El chat aparece con otro color o texto ⇾ los cambios no fueron guardados. Vuelva a la configuración de la bandeja y haga clic en Actualizar.

  • El botón sigue sin verse después de instalar el código ⇾ el navegador conserva la versión anterior de la página. Pruebe en una ventana de incógnito o borre la memoria caché.


🚀 Resultado

Con el canal de Sitio Web configurado:

✔ Los visitantes de su web pueden escribirle en tiempo real 💬
✔ Su equipo responde desde una bandeja compartida 👥
✔ Las conversaciones quedan registradas con su historial 🗂️
✔ Centraliza todos sus canales en un solo lugar 🚀

¡Listo! 🎉 Ya configuró su canal de Sitio Web en Chatealo.


➡️ Siguientes pasos recomendados


💬 ¿Tiene alguna duda?

Si tiene alguna pregunta, no dude en ponerse en contacto con nuestro equipo de soporte.

¡Estamos para acompañarlo en cada paso! 🚀