Cómo instalar un chatbot en tu web, sea cual sea la plataforma

Equipo de Ada Assistant (Wozzo) · Actualizado: octubre 2026

Para instalar un chatbot en tu web pegas una sola línea de código justo antes del cierre </body> de todas las páginas, normalmente en el pie global de tu plantilla. Con eso el chat de Ada aparece en toda la web, y lo que responde se configura después desde el panel, sin volver a tocar la web.

Abajo tienes los pasos para webs hechas a mano, con Google Tag Manager, Joomla o Drupal, un email listo para enviárselo a tu informático y la lista de problemas típicos.

Probar 7 días gratis

Si tu web está hecha con una plataforma conocida

Si tu web está en WordPress, Wix, Shopify, Webflow, Squarespace o PrestaShop, tienes una guía específica con los menús exactos y lo que pide cada plan. Elige la tuya:

WordPress
Con el plugin WPCode o el tema hijo.
Wix
Ajustes > Código personalizado. Requiere plan Premium.
Shopify
En theme.liquid, sin apps.
Webflow
Site settings > Custom code > Footer code.
Squarespace
Inyección de código > Pie de página.
PrestaShop
Módulo o plantilla del tema hijo.

Si tu plataforma no está en la lista, sigue leyendo: el principio es el mismo en todas.

El código y de dónde sale TU_CODIGO

El código lo tienes en el panel de Ada, en la pantalla de instalación, ya completo con el identificador de tu asistente. TU_CODIGO es ese identificador: el panel lo pone por ti, así que basta con copiar y pegar.

Código de Ada

<script src="https://ada-assistant.com/wozzo-chat.js" data-public-url="TU_CODIGO" defer></script>

src es la dirección del programa del chat. No la cambies.
data-public-url dice qué asistente cargar: el tuyo.
defer hace que el chat se cargue cuando la página ya está lista, para no retrasar tu web.

Una vez pegado, todo lo demás (respuestas, colores, mensaje de bienvenida, preguntas sugeridas) se cambia desde el panel de Ada. No hay que volver a tocar la web.

En una web hecha a mano (HTML)

Pega el código justo antes de </body> en cada página, o en la plantilla común si tu web la tiene. Si tienes muchas páginas HTML sueltas, hazlo en todas o el chat solo saldrá en las que lo lleven.

Dónde va en el HTML

<!DOCTYPE html>
<html lang="es">
  <head>
    ...
  </head>
  <body>
    ...
    <script src="https://ada-assistant.com/wozzo-chat.js" data-public-url="TU_CODIGO" defer></script>
  </body>
</html>

Si tu web usa un generador o un framework (Next.js, Astro, Hugo, Jekyll…), el sitio adecuado es la plantilla o el layout principal, que es lo que se repite en todas las páginas.

Con Google Tag Manager

Si tu web ya tiene Google Tag Manager, puedes instalar Ada sin tocar la web: creas una etiqueta HTML personalizada con el código y la activas en todas las páginas.

Crea una etiqueta nueva
En tu contenedor, ve a Etiquetas > Nueva y elige el tipo HTML personalizado.
Pega el código
Pega el código de Ada en el recuadro de HTML.
Elige el activador
Como activador, elige All Pages (todas las páginas).
Guarda y publica
Guarda la etiqueta y pulsa Enviar para publicar una nueva versión del contenedor. Hasta que no publicas, no se aplica.

En Joomla, Drupal y otros gestores

En cualquier gestor de contenidos hay dos caminos: una extensión que permita añadir código al pie de todas las páginas, o la plantilla del tema. La extensión es más segura si no programas.

Plataforma	Opción sin programar	Opción con plantilla
Joomla	Una extensión para insertar código en cabecera y pie	El archivo index.php de la plantilla, antes de </body> (mejor en una plantilla hija)
Drupal	Un módulo para añadir scripts al sitio	La plantilla html.html.twig de tu tema, antes de </body> (mejor en un subtema)
Otros (Jimdo, GoDaddy, Strato, etc.)	Busca en sus ajustes «código personalizado», «HTML de cabecera/pie» o «scripts»	Pide a su soporte dónde se añade código a todas las páginas

Muchos creadores de webs sencillos solo permiten pegar código en sus planes de pago. Si no encuentras la opción, pregunta a su soporte si tu plan lo incluye.

Si te lleva la web un informático o una agencia

Desde el panel de Ada puedes enviarle las instrucciones por email con tu código ya puesto, el enlace a la guía de su plataforma y el contacto de soporte. Si prefieres escribirle tú, puedes usar este texto:

Email para tu informático

Hola,

Queremos añadir el asistente de Ada Assistant a la web. Solo hay que pegar esta línea antes de </body> en todas las páginas (o en el pie global del tema):

<script src="https://ada-assistant.com/wozzo-chat.js" data-public-url="TU_CODIGO" defer></script>

Guía con los pasos por plataforma: https://ada-assistant.com/instalar-chatbot-en-tu-web

Cuando esté, ¿me avisas para probarlo?

Gracias.

Para alguien que conoce la web es un cambio de cinco minutos. Lo único que necesita saber es que va en todas las páginas y al final.

Cómo comprobar que está bien instalado

Abre tu web en una ventana de incógnito y espera unos segundos: tiene que salir la burbuja del chat en una esquina. Usa incógnito para no ver una versión guardada de la página.

Prueba varias páginas
La portada y al menos dos páginas interiores.
Hazle una pregunta real
Algo que esté en tu web, como el horario o un precio.
Mira el código fuente si no sale
Clic derecho > Ver código fuente y busca «wozzo-chat.js». Si no está, el código no se ha guardado o la página está en caché.
Revisa el panel
La pantalla de instalación de Ada te indica cuándo ha detectado el asistente en tu dominio.

Problemas típicos y cómo resolverlos

Síntoma	Causa probable	Solución
La burbuja no sale y el código no aparece en el código fuente	No se guardó o la página está en caché	Revisa dónde lo pegaste y vacía la caché de la web, del alojamiento y del CDN
El código aparece pero la burbuja no	Un bloqueador de anuncios o una extensión del navegador	Prueba en otro navegador o en incógnito sin extensiones
No sale en ningún navegador, aunque el código está	La política de seguridad de contenidos (CSP) de la web bloquea scripts externos	Tu informático debe permitir ada-assistant.com en script-src y frame-src de la CSP
Sale solo en algunas páginas	El código está en una página, no en la plantilla común	Muévelo al pie global
Sale dos veces	Pegado en dos sitios (plantilla y Tag Manager, por ejemplo)	Déjalo solo en uno
Tapa otro botón, como el de WhatsApp	Dos elementos en la misma esquina	Quita el botón antiguo o muévelo; el asistente puede atender también WhatsApp

El siguiente paso: WhatsApp

Con el plan Premium, el mismo asistente responde en tu WhatsApp con la API oficial de Meta. Sigues usando la app WhatsApp Business en el móvil gracias a la coexistencia. Lo tienes en chatbot para WhatsApp.

Preguntas frecuentes

¿Dónde se pega el código del chatbot?

Justo antes de </body>, en todas las páginas. Lo más cómodo es el pie global de tu plantilla o el campo de «código en el pie» de tu plataforma.

¿Puedo ponerlo en la cabecera (head)?

Sí, funciona porque lleva «defer», pero en el pie afecta menos a la carga de la página.

¿Tengo que tocar la web cada vez que cambie las respuestas?

No. El código solo carga el asistente; las respuestas, fuentes y colores se cambian en el panel de Ada.

¿Funciona con Google Tag Manager?

Sí. Crea una etiqueta de HTML personalizado con el código, actívala en All Pages y publica el contenedor.

¿Hace más lenta mi web?

El script se carga con «defer», cuando la página ya está lista, así que el contenido se muestra antes que el chat.

¿Qué hago si no sé quién gestiona mi web?

Mira en el panel de tu alojamiento o pregunta a quien te la hizo. Desde el panel de Ada puedes enviarle las instrucciones por email.

Prueba Ada Assistant 7 días gratis

Sin tarjeta. Pega la dirección de tu web y en unos minutos tienes un asistente que responde con tu información.

Crear mi asistente gratis

Fuentes

MDN: elemento <script> y atributo defer (consultado en octubre 2026)
MDN: Content Security Policy (CSP) (consultado en octubre 2026)