> ## Documentation Index
> Fetch the complete documentation index at: https://help.chateea.com/docs/llms.txt
> Use this file to discover all available pages before exploring further.

# Configura el chat en vivo en tu sitio web

> Crea el widget de chat en vivo, personalízalo con tu marca e instálalo en tu sitio web o embudo.

El widget de chat te permite conversar con los visitantes de tu sitio web en tiempo real. En esta guía creas un widget de **chat en vivo**, lo personalizas con tu marca y lo instalas en un sitio web o embudo hecho en Chateea. Los mensajes llegan a **Conversaciones**, donde los puede atender tu equipo o la IA conversacional.

## Tipos de widget de chat

Al crear un widget nuevo, Chateea te ofrece varias experiencias:

| Tipo | Para qué sirve |
| - | - |
| Chat todo en uno | Combina varios canales en un mismo widget |
| Chat por SMS o correo | El visitante deja sus datos y la conversación continúa por SMS o correo |
| Chat en vivo | Conversación en tiempo real dentro del sitio web |
| WhatsApp | Lleva al visitante a escribirte por WhatsApp |

En esta guía usamos **Chat en vivo**.

## Crea el widget de chat en vivo

**1. Abre la sección de widgets**

Ve a **Sitios → Widget de chat** y haz clic en **Nuevo**.

**2. Elige el tipo**

Selecciona **Chat en vivo**.

**3. Personalízalo**

Ajusta colores, textos de bienvenida, avatar y demás opciones para que se vea como tu marca.

**4. Guarda**

Haz clic en **Guardar**.

**5. Copia el código**

Haz clic en **Obtener código → Copiar**. Necesitarás este código si vas a instalar el widget pegándolo manualmente.

## Instala el widget en tu sitio o embudo

Tienes dos formas de agregar el widget a un sitio web o embudo de Chateea. Elige la que te resulte más cómoda.

### Opción 1: desde la configuración del sitio (sin código)

Es la forma más sencilla si no quieres tocar código.

**1. Abre el sitio o embudo**

Ve a **Sitios → Sitios web** o **Sitios → Embudos** y abre la **Configuración** del sitio o embudo.

**2. Selecciona el widget**

En la sección **Widget de chat**, elige tu widget de chat en vivo.

**3. Guarda**

Haz clic en **Guardar**. El widget aparecerá en todas las páginas del sitio o embudo.

### Opción 2: con el código de inserción

Útil si ya sabes trabajar con scripts o quieres el widget solo en una página concreta.

**1. Abre el editor**

Ve a **Sitios → Sitios web** o **Sitios → Embudos** y abre la página en el editor.

**2. Abre el código de seguimiento**

Haz clic en el ícono de **Código de seguimiento** (`</>`).

**3. Pega el código**

Pega el código del widget que copiaste antes.

**4. Guarda y publica**

Haz clic en **Guardar** y publica la página para que el cambio quede visible.

> [!TIP]
>
> Si tu sitio está fuera de Chateea (por ejemplo en WordPress u otro creador de sitios), pega el mismo código antes de la etiqueta de cierre del cuerpo de la página o en el área de scripts personalizados de esa plataforma.

## Prueba el widget

1. Abre tu sitio publicado en una ventana de incógnito.
2. Abre el chat y envía un mensaje de prueba.
3. Ve a **Conversaciones** en Chateea y confirma que el mensaje llegó.
4. Responde desde Chateea y comprueba que la respuesta aparece en el chat del sitio.

## Buenas prácticas

* Define quién atiende el chat y en qué horario, o asigna la IA conversacional para responder fuera de horario.
* Escribe un mensaje de bienvenida que invite a preguntar ("¿En qué te podemos ayudar hoy?").
* Evita instalar el widget dos veces (por configuración y por código a la vez), porque podría aparecer duplicado.

## Artículos relacionados

> **[Chat en vivo en Conversaciones](https://help.chateea.com/docs/conversaciones/chat-en-vivo.md)**
>
> Cómo se reciben y gestionan los chats en vivo.

> **[Chat web en Conversaciones](https://help.chateea.com/docs/conversaciones/chat-en-vivo.md)**
>
> Atiende los mensajes del widget desde la bandeja.

> **[Conecta tus canales](https://help.chateea.com/docs/primeros-pasos/conecta-tus-canales.md)**
>
> Reúne todos tus canales de atención.

> **[Lanza tu sitio web desde una plantilla](https://help.chateea.com/docs/primeros-pasos/lanza-tu-sitio-web-desde-plantilla.md)**
>
> Publica tu sitio con tu propio dominio.


This documentation is built and hosted on [Mintlify](https://mintlify.com), a developer documentation platform.