Volver al panel

Documentación

Aprende a usar Asyntai

Chat integrado

Muestra el widget de chat integrado en su página en lugar de una burbuja flotante

Obtener código de inserción
Todos los planes

Descripción general

Por defecto, el widget de chat de Asyntai aparece como una burbuja flotante en la esquina de su sitio web. Con el chat integrado, también puede mostrar el chat directamente en su página — por ejemplo, en una sección "Chatea con nosotros" en su página de inicio.

La burbuja flotante sigue funcionando junto con el chat integrado. Los visitantes que no se desplacen hasta la sección integrada aún pueden usar la burbuja. Ambos comparten la misma conversación.

Cómo funciona

1
Añada una etiqueta de script Colócala donde quieras que aparezca el chat en tu HTML
2
El chat se renderiza en línea El widget aparece en esa posición, siempre visible, del mismo tamaño que el chat regular
3
La burbuja permanece activa La burbuja flotante permanece en la esquina para los visitantes que no ven el chat integrado
4
Conversación compartida Los mensajes se sincronizan entre el chat integrado y el widget flotante en tiempo real

Configuración

Añada esta única línea de HTML donde quiera que aparezca el chat en su página:

<script src="https://asyntai.com/static/js/chat-embed.js" data-asyntai-id="YOUR_WIDGET_ID"></script>

Reemplaza YOUR_WIDGET_ID con tu ID de widget. Puedes encontrar tu código de inserción con tu ID pre-rellenado en la página de configuración del chat integrado.

Nota: El script principal chat-widget.js también debe estar en la página. Si ya instalaste el widget de Asyntai en tu sitio, esto ya está resuelto.

Ejemplo

Así es como podrías usarlo en una página de inicio:

<section style="max-width: 500px; margin: 0 auto;">
    <h2>Chat with us</h2>
    <p>Ask us anything — our AI assistant is here to help.</p>

    <!-- The chat will appear right here -->
    <script src="https://asyntai.com/static/js/chat-embed.js" data-asyntai-id="YOUR_WIDGET_ID"></script>
</section>

Detalles

Tamaño

El chat integrado se renderiza al mismo tamaño que el widget flotante: 400px de ancho y 650px de alto en escritorio, ancho completo y 550px de alto en móvil. Puede controlar su ubicación estilizando el contenedor padre.

Comportamiento de la burbuja flotante

Cuando el chat integrado es visible en pantalla y un visitante hace clic en la burbuja flotante, se desplaza hasta el chat integrado. Si el chat integrado no está a la vista, la burbuja abre el chat flotante regular.

Sincronización de mensajes

Tanto el chat integrado como el flotante comparten la misma conversación. Los mensajes enviados desde cualquiera aparecen en ambos. Se usan la misma sesión, contexto de IA e historial de chat.

Múltiples páginas

Puede usar el chat integrado en algunas páginas y el widget flotante regular en otras. Solo incluye el script de inserción en las páginas donde quieras el chat en línea. La conversación se mantiene entre páginas como de costumbre.

Vista previa en vivo

Aquí hay un chat integrado en vivo para que puedas ver cómo se ve:

Requisitos

El widget de chat principal de Asyntai (chat-widget.js) debe estar instalado en la página
Funciona en todos los planes — no se requiere actualización
Compatible con todos los navegadores que soportan Shadow DOM (todos los navegadores modernos)

Consejo: Pruebe el chat integrado colocándolo primero en una página de staging. Asegúrese de que se vea bien dentro del diseño de su página antes de pasarlo a producción.