Tabla de contenidos
Agregar chat en vivo a tu sitio web solía requerir plugins, archivos de configuración y a veces un desarrollador. En 2026, solo necesitas una línea de JavaScript y unos 2 minutos. Esta guía cubre las plataformas más populares en América Latina — WordPress, Shopify, Tilda, Wix y HTML puro — para que puedas comenzar a chatear con visitantes hoy mismo.
Usaremos Svyazio como ejemplo. Es una herramienta de chat en vivo gratuita con una bandeja de entrada unificada para chat web, Telegram y email. El plan gratuito incluye 1 agente y 50 conversaciones al mes — sin tarjeta de crédito, sin límite de tiempo.
Por qué tu sitio web necesita chat en vivo
Antes de los pasos técnicos, respondamos la pregunta obvia: ¿para qué? Tres razones respaldadas por datos.
1. El chat en vivo aumenta las conversiones. Según Forrester Research, los visitantes que interactúan con el chat en vivo tienen 3–5 veces más probabilidades de convertirse. Para tiendas de e-commerce, esto significa más pedidos completados. Para empresas de SaaS, más registros. El mecanismo es simple: las personas tienen preguntas, y cuanto más rápido las respondas, más probable es que actúen.
2. Los clientes prefieren el chat sobre el teléfono y el email. Un estudio de J.D. Power encontró que el 42% de los clientes prefiere el chat en vivo para soporte — más que el teléfono (32%) o el email (23%). El chat es no intrusivo, instantáneo y conveniente. Si tus únicos canales son teléfono y email, estás perdiendo la mayoría de las conversaciones potenciales.
3. El chat reduce los costos de soporte. Un agente puede manejar 3–5 conversaciones simultáneamente — frente a 1 llamada a la vez. Las respuestas guardadas (respuestas predefinidas a preguntas frecuentes) reducen el tiempo de gestión promedio un 30–50%.
Instalación universal — 3 pasos
Este método funciona en cualquier sitio web — ya sea construido con HTML, React, Vue, Next.js o cualquier otro framework. Si puedes agregar una etiqueta <script>, esto funcionará.
Paso 1: Crear una cuenta gratuita
Ve a app.svyazio.com y regístrate. El proceso toma 30 segundos — nombre, email, contraseña, listo. Sin tarjeta de crédito. Llegarás a tu dashboard con una bandeja de entrada vacía.
Paso 2: Copiar el código del widget
Ve a Configuración → Instalación. Verás un código como este:
Cópialo. El orgId es tu identificador de organización único. Lo encontrarás en Configuración → Instalación.
Paso 3: Pegar antes de </body>
Abre el HTML de tu sitio y pega el código justo antes de la etiqueta de cierre </body>. Guarda el archivo y recarga la página. El widget de chat aparece en la esquina inferior derecha — listo para conversaciones.
El script carga de forma asíncrona — no bloquea el renderizado de tu página. La velocidad de tu sitio no se ve afectada.
Instalación en WordPress
Método A: Plugin WPCode (más fácil)
Instala el plugin gratuito WPCode (Insert Headers and Footers). Ve a Fragmentos de código → Body. Pega el script de Svyazio. Haz clic en Guardar. Listo — sin necesidad de editar archivos del tema.
Método B: Archivo del tema
Ve a Apariencia → Editor de archivos del tema → footer.php. Pega el script antes de </body>. Guarda. Nota: si actualizas tu tema, deberás volver a agregar el script. Usar un tema hijo evita esto.
Método C: Elementor
Si usas Elementor, ve a Elementor → Código personalizado → Footer. Pega el script. Publica. Funciona con la función de código personalizado de Elementor Pro.
Svyazio usa Shadow DOM — el widget se renderiza en un contenedor aislado que previene conflictos de CSS con tu tema de WordPress. Compatible con Astra, GeneratePress, Kadence, Divi y todos los demás. Guía completa de integración con WordPress →
Instalación en Shopify
En tu Admin de Shopify, ve a Tienda en línea → Temas → Acciones → Editar código. Abre theme.liquid. Encuentra la etiqueta de cierre </body> y pega el script de Svyazio justo antes. Haz clic en Guardar.
El widget de chat aparece ahora en cada página de tu tienda — inicio, productos, carrito, checkout y blog. El aislamiento Shadow DOM garantiza cero conflictos CSS. Guía completa de integración con Shopify →
Instalación en Tilda
Para todo el sitio: Ve a tu proyecto Tilda → Configuración del sitio → Más → Código HTML → Antes de la etiqueta </body>. Pega el código. Republica todas las páginas.
Para una sola página: Agrega un bloque T123 HTML (Otros → Código HTML). Pega el código del widget adentro. Útil si solo quieres chat en ciertas páginas de destino.
Después de pegar, haz clic en Republicar — Tilda almacena páginas en caché estáticamente. Guía completa de integración con Tilda →
Otras plataformas
El mismo enfoque de una línea de JavaScript funciona en:
- Wix: Dashboard → Configuración → Código personalizado → Final del body. Pega. Publica.
- Squarespace: Configuración → Avanzado → Inyección de código → Footer. Pega. Guarda.
- Webflow: Configuración del proyecto → Código personalizado → Body. Pega. Publica.
- Next.js / React: Agrega la etiqueta de script en tu
_document.tsxo usanext/scriptconstrategy="lazyOnload". - HTML estático: Pega antes de
</body>en tu archivo HTML. Despliega.
Personalizar tu widget de chat
Después de la instalación, personaliza el widget desde tu dashboard de Svyazio — sin cambios de código:
- Color del widget: Adapta el color principal de tu marca
- Mensaje de bienvenida: Configura un saludo que aparece cuando los visitantes abren el chat
- Formulario offline: Recopila el email del visitante cuando tu equipo no está disponible
- Horario comercial: Muestra estado en línea/fuera de línea automáticamente (plan Pro)
- Mensajes automáticos: Activa mensajes según URL, tiempo en el sitio o profundidad de scroll (plan Pro)
- White-label: Elimina el branding de Svyazio para una experiencia totalmente personalizada (plan Pro)
Multicanal: Telegram + Email
El chat en vivo es solo el comienzo. Los clientes modernos usan múltiples canales — y esperan soporte fluido en todos ellos. Svyazio admite tres canales en una sola bandeja de entrada:
- Chat del sitio web — el widget que acabas de instalar
- Telegram — conecta tu bot de Telegram (plan Pro, hasta 10 bots)
- Email — conecta soporte@tuempresa.com vía IMAP/SMTP (plan Business, hasta 10 cuentas en Pro)
Los tres canales se fusionan en una sola bandeja de entrada. Si un cliente chatea en tu sitio, luego envía un email de seguimiento, y después mensajea tu bot de Telegram — los tres aparecen en el mismo hilo de conversación.
Qué hacer después de la instalación
Instalaste el widget. Ahora sácale el máximo provecho:
- Descarga la app móvil. Svyazio tiene apps nativas para iOS y Android con notificaciones push. Nunca perderás un mensaje — incluso cuando estés lejos de tu escritorio.
- Crea 5–10 respuestas guardadas. ¿Cuáles son las preguntas más frecuentes? Costos de envío, política de devoluciones, precios, horarios. Escribe respuestas guardadas para éstas. Tus agentes responderán en 2 clics.
- Configura un mensaje automático. En el plan Pro, puedes activar mensajes según el comportamiento del visitante. Ejemplo: si alguien pasa 30+ segundos en la página de precios, activa "¿Tienes preguntas sobre nuestros planes? ¡Estamos aquí!"
- Invita a tu equipo. En los planes Business y Pro, puedes invitar múltiples agentes. Asigna conversaciones, deja notas internas y usa departamentos para enrutar chats.
Resumen de precios
Svyazio ofrece precios transparentes por agente sin costos ocultos:
- Starter (Gratis): 1 agente, 50 conversaciones/mes — para sitios personales y pruebas
- Business ($19/agente/mes): email, respuestas guardadas, vista previa de escritura, notas internas, hasta 10 agentes
- Pro ($39/agente/mes): Telegram, asistente IA, departamentos, analítica, white-label, agentes ilimitados
Ambos planes de pago incluyen una prueba gratuita de 7 días sin tarjeta de crédito.
Preguntas frecuentes
defer. No bloquea el renderizado ni afecta los Core Web Vitals. Entregado via CDN globalmente.