Añade chat en vivo a tu sitio web
En esta página
El chat en vivo es una ventana de chat que se encuentra en la esquina de su sitio web; los visitantes le escriben directamente desde su sitio y los mensajes caen en su bandeja de entrada de CRM. Solo necesitas añadir una sola línea de código a tu sitio para la instalación.
- Configuración del chat en vivoCódigo de instalación, apariencia y seguridad
- SinopsisPasos de la plataforma e instrucciones para su webmaster
- BandejaResponder a conversaciones
Configuración
- Copia el código — Configuración › Chat en vivo En la página, abre la pestaña "Cargar" y haz clic en el botón "Copiar código" en la pestaña "Código del widget".
- Pegar en tu sitio: coloca el código en cada página de tu sitio, justo antes de la etiqueta de cierre
</head>. Si el sitio usa una plantilla o un archivo de diseño común, puede agregarlo una vez. - Marque — Abra su sitio; el iniciador de chat (burbuja) debe aparecer en la esquina.
Administradores Sinopsis También puedes instalar desde la sección "Comienza en pocos pasos" de la página: El botón "Configurar plataforma" muestra instrucciones paso a paso para WordPress, Shopify, Wix, Squarespace, Webflow, Google Tag Manager, Joomla y "Otros / HTML plano". "Enviar instrucciones a su webmaster" envía el código y los pasos a la dirección de correo electrónico que ingrese; recibirá las respuestas.
Si necesita especificar manualmente desde qué dominio se cargará el widget, hay un ejemplo de código listo en la pestaña "Diferente Dominio" en la pestaña "Cargar".
Si deseas chatear sin crear un widget, puedes compartir el enlace de la página de chat directamente haciendo clic en "Copiar enlace" desde la pestaña "Página de chat" en la pestaña Widgets.
Apariencia y Textos
Cualquier cambio que haga en la pestaña " Widget " aparecerá en la vista previa en directo a la derecha; pulse el botón " Guardar cambios " cuando haya terminado. Tarjetas principales:
- Pantalla de inicio → Pantalla que aparece cuando se abre el widget: avatares, tarjeta del centro de ayuda, sección de solicitudes.
- Mensajes Textos de " Bienvenida ", " Bienvenida anónima " (cuando se desconoce el nombre del visitante) y " Entrada ".
- Antecedentes y enlaces → El color o visual detrás del saludo; los accesos directos a ser listados en la pantalla principal.
- Pantalla de chat → " Mensaje de bienvenida " (primera burbuja en el nuevo chat), marcador de posición de entrada, " No hay agente disponible " y " Cliente en cola " textos.
- Formulario de pre-chat / formulario de post-chat → Campos a ser preguntados antes del primer mensaje; breve valoración o retroalimentación a mostrarse después de cerrar el chat.
- Pantallas → Qué pestañas aparecerán en la navegación inferior y en la pantalla predeterminada.
- Lanzador → Icono especial (JPG, PNG o GIF menor de 100 KB), posición (izquierda o derecha) y espacios de margen.
- Estilo → Logo claro y oscuro, " Tema de widget por defecto " (Claro, Oscuro o Sistema).
Traducciones a otros idiomas Localizaciones Desde la página.
Cuando nadie está en línea
Si nadie de tu equipo está en línea, el visitante verá "No hay representante disponible". El chat permanece abierto; cuando respondes, si el visitante no está en el chat, la respuesta se le envía por correo electrónico. Esto requiere la dirección de correo electrónico del visitante, por lo que se recomienda recopilar los correos electrónicos con un "formulario de pre-chat".
En los " Tiempos límite ", puede elegir qué sucede con las conversaciones sin respuesta. Cada regla se abre con una tecla separada y la duración se introduce en minutos:
- Transferir a otro delegado (5 minutos después de abrir): Si el agente no responde, el cliente se transfiere a otro agente disponible; en grupos asignados manualmente, el chat se pone en cola.
- Marcar conversación como inactiva (10 minutos): los chats pasivos no cuentan para el límite de chats simultáneos del delegado.
- Cerrar el chat (15 minutos): El cliente puede volver a abrir el mismo chat escribiendo un nuevo mensaje.
La "Limpieza de visitantes" en la misma pestaña determina cuántos días se mantendrán los visitantes anónimos que nunca le han escrito (por defecto 30 días).
Nombres de dominio
En la pestaña " Seguridad ", en el campo " Nombres de dominio de confianza ", escriba los dominios que puede cargar el widget, separados por comas. Usa el formato *.example.com para todos los nombres de subdominio. Si el espacio está vacío, el widget se puede agregar a cualquier sitio. No olvides guardar el cambio con "Guardar cambios".
Autenticar visitante
Para hacer coincidir de forma segura a los usuarios que inician sesión en tu sitio con los registros de clientes en tu CRM, firmas la dirección de correo electrónico del visitante con una clave secreta en tu servidor (HMAC-SHA256).
- Obtener la clave secreta: en la pestaña " Autenticación " de la pestaña ", " Seguridad ", seleccione " Mostrar clave secreta " y luego " Copiar clave secreta ". " Mantenga la clave solo en su servidor.
- Generar la firma en el servidor: calcula HMAC-SHA256 de modo que tu clave sea tu clave secreta, la dirección de correo electrónico del visitante del mensaje y obtén el resultado como texto hexadecimal (hex).
- Agregar a la página — Introduce el correo electrónico y la firma en
window.BeChatSettingsantes del código del widget. - Si desea solicitarla, active la tecla " Requerir autenticación " y pulse el botón " Guardar cambios ".
Node.js con firma:
const crypto = require('crypto');
const emailHash = crypto
.createHmac('sha256', process.env.CANLI_SOHBET_GIZLI_ANAHTAR)
.update(kullanici.email)
.digest('hex');Firma con PHP:
$emailHash = hash_hmac('sha256', $kullanici['email'], getenv('CANLI_SOHBET_GIZLI_ANAHTAR'));En página, antes del código del widget:
<script>
window.BeChatSettings = {
user: {
email: "musteri@ornek.com",
email_hash: "SUNUCUNUZDA_URETILEN_IMZA"
}
};
</script>
<!-- Ardından "Yükle" sekmesinden kopyaladığınız widget kodu -->El campo email debe ser exactamente el mismo que el valor que firmas; incluso la distinción entre mayúsculas y minúsculas invalida la firma. Nunca pongas la clave secreta en el código fuente de la página.
Si la firma es válida, el visitante se vincula al registro del cliente en ese correo electrónico (o se abre uno nuevo) y su correo electrónico se considera verificado; la línea "Correo electrónico verificado" en el panel del cliente muestra "Sí". Otros campos que agregue al mismo objeto se escribirán en él si hay un atributo de cliente definido con la misma clave. Cuando "Requerir autenticación" está habilitado, los datos del usuario sin una firma válida se ignoran y el visitante continúa de forma anónima.
Fuente de visitantes
El panel de clientes a la derecha de la entrevista muestra de dónde vino el visitante:
- Fuente: Landing page, Referrer y UTM fuente, herramienta, campaña, término, valores de contenido. Estas se guardan una vez en la primera visita; la navegación posterior dentro del sitio y las referencias de su propio sitio no las cambian.
- Ubicación e idioma: Idioma del navegador y idioma del reloj. Si el idioma o la zona horaria están vacíos en el registro de persona, se llenarán por visita; el valor que ingresó manualmente no se sobrescribirá.
- Dispositivo: Navegador, sistema operativo, dispositivo, dirección IP y país de sesión.