> For the complete documentation index, see [llms.txt](https://docs.dapta.ai/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.dapta.ai/dapta-docs-es/agentes-de-texto/canales/widget-desplegar-tu-agente-en-una-pagina-web.md).

# Widget: Desplegar tu Agente en una página web

Instala y personaliza el Widget de Dapta, verifica una conversación real e investiga respuestas demoradas.

Abre **Canales → Dapta Widget** dentro de tu Agente de Texto. Necesitas acceso para editar el sitio o sus scripts y un agente preparado para atender clientes.

## Instala y prueba

1. Copia el **ID del agente** como referencia y el código de inserción generado por Dapta.
2. Pega el código en el HTML o campo de scripts autorizado de tu sitio, siguiendo su proceso de publicación. Usa el código generado en lugar de reconstruir la URL.
3. Publica el cambio del sitio y abre la página real en una sesión nueva del navegador.
4. Envía un mensaje de prueba, verifica la respuesta y encuentra la conversación en la [Bandeja de entrada](/dapta-docs-es/agentes-de-texto/operar-conversaciones.md).
5. Prueba el diseño en computador y móvil antes de incorporarlo al recorrido del cliente.

Evita instalar el mismo código dos veces mediante un gestor de etiquetas y el HTML de la página.

## Personaliza la experiencia

| Ajuste                    | Qué cambia                                                                                                         |
| ------------------------- | ------------------------------------------------------------------------------------------------------------------ |
| Mensaje de bienvenida     | Texto inicial que ve el cliente.                                                                                   |
| Preguntas predeterminadas | Preguntas que el visitante puede pulsar. Agrega ejemplos manuales o genera sugerencias con IA y revísalas.         |
| Estilo del widget         | Colores principales/fondo y CSS avanzado opcional. Prueba contraste, pantallas pequeñas y conflictos con el sitio. |
| Apertura automática       | Abre el widget automáticamente. Si está activada y la lista de páginas está vacía, aplica a todas al actualizar.   |
| Lista de páginas          | Agrega cada entrada en el control y pulsa Enter para confirmarla. No es una lista separada por barras.             |
| Agente de voz             | Si está configurado, elige el agente del flujo de solicitud de llamada; no es solo una voz del agente de texto.    |

Pulsa **Guardar cambios** y comprueba el resultado en el sitio real. Si también cambiaste instrucciones del agente, sigue el flujo independiente de [guardar, probar y publicar](/dapta-docs-es/agentes-de-texto/playground.md).

## Proporciona contexto

Las instrucciones adicionales pueden usar parámetros suministrados por tu sitio. Sigue el ejemplo generado de `setConversationParams(object)`; las claves del ejemplo son `user_id`, `user_name` y `user_email`.

Proporciona los valores desde tu aplicación en el momento adecuado de la inicialización. Son ejemplos, no una confirmación de que Dapta conoce automáticamente al visitante. No incluyas secretos, tokens ni datos personales innecesarios en código del navegador. El contexto del navegador no reemplaza la autorización del servidor.

Activa/configura las instrucciones adicionales, guarda y prueba una conversación nueva para confirmar el contexto.

## Si falta el widget o tarda la respuesta

1. **No aparece el widget:** confirma que el código está en la página publicada, se carga una sola vez y no lo bloquea la política de scripts o una extensión.
2. **Apariencia/contenido anterior:** guarda, recarga el sitio y verifica que el código corresponde al agente correcto.
3. **Respuesta lenta:** espera a que termine la respuesta actual; evita repetir el mismo mensaje. La demora configurada, las acciones externas y el procesamiento pueden afectar el tiempo percibido.
4. **Respuesta visible en la Bandeja, pero no en el sitio:** registra URL, agente, conversación, hora y navegador. Esto distingue un problema de visualización/entrega de uno de generación.
5. **No hay respuesta en ninguna vista:** revisa publicación, [comportamiento de la conversación](/dapta-docs-es/agentes-de-texto/comportamiento-de-la-conversacion.md), fallos de acciones y asignación humana.
6. **Fallo persistente:** prueba otra conversación y navegador; contacta a soporte con los detalles. No incluyas credenciales en capturas.

El sitio integrado y la vista previa del editor pueden usar versiones diferentes. Una vista previa correcta no reemplaza probar la página publicada; el manejo de respuestas lentas tampoco garantiza un tiempo máximo de respuesta.

*Revisión del código fuente: 17 de septiembre de 2026.*

{% content-ref url="/pages/Lia8RQnFOFMk4rYGGft5" %}
[Bandeja de entrada](/dapta-docs-es/agentes-de-texto/operar-conversaciones.md)
{% endcontent-ref %}


---

# Agent Instructions
This documentation is published with GitBook. GitBook is the documentation platform designed so that both humans and AI agents can read, navigate, and reason over technical content effectively. Learn more at gitbook.com.

## Querying This Documentation
If you need additional information that is not directly available in this page, you can query the documentation by asking a question.

Perform an HTTP GET request on the following URL with the `ask` and `goal` query parameters:

```
GET https://docs.dapta.ai/dapta-docs-es/agentes-de-texto/canales/widget-desplegar-tu-agente-en-una-pagina-web.md?ask=<question>&goal=<user_goal>
```

`ask` is the immediate question: it should be specific, self-contained, and written in natural language.
`goal` is what the user is ultimately trying to achieve, the reason they need the answer. Sharing it helps GitBook give you a better, more relevant answer. A goal is most helpful when it describes the outcome the user wants rather than restating the question. For example, with `ask=how do I create an API token`, a goal like `automate deployments from our CI pipeline` lets GitBook tailor the answer to that use case.

The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.