Embeber el chatbot en tu web

El widget de Automahawk es un script JavaScript de 22 KB (gzipped) que añade un chatbot conversacional a cualquier página web.

Snippet básico

Pega este fragmento justo antes de </body> en tu sitio:

<script
  src="https://automahawk.com/widget.js"
  data-slug="tu-negocio"
  data-color="#22d3ee"
  data-position="bottom-right"
></script>

Sustituye tu-negocio por el slug que aparece en tu panel (lo encuentras en Configuración → General).

Atributos disponibles

Atributo	Obligatorio	Default	Descripción
data-slug	Sí	—	Identificador de tu negocio en Automahawk
data-color	No	#00D9FF	Color principal del bubble
data-position	No	bottom-right	bottom-right o bottom-left
data-name	No	(de tu cuenta)	Nombre que muestra el chat
data-welcome	No	(de tu cuenta)	Mensaje inicial al abrir
data-locale	No	es	Idioma (es, en, fr, de, pt, it)

Plataformas comunes

WordPress

Instala el plugin Insert Headers and Footers, pega el snippet en “Scripts in Footer” y guarda.

Shopify

Editor de temas → Layout → theme.liquid. Pega justo antes de </body>.

Wix / Squarespace / Webflow

Configuración del sitio → Custom code → Footer. Pega el snippet.

Astro / Next / Vue

Inclúyelo en tu layout principal con la etiqueta <script> directamente.

Personalización avanzada

El widget vive dentro de un Shadow DOM, lo que significa que no rompe estilos de tu web ni se ve afectado por ellos. Si necesitas customizar más allá del color:

<script
  src="https://automahawk.com/widget.js"
  data-slug="tu-negocio"
  data-color="#ff6b6b"
  data-name="Reserva con Bea"
  data-welcome="¡Hola! Soy Bea. Cuéntame qué necesitas."
></script>

Verificar que funciona

1. Carga la página en una pestaña incógnito.
2. Verás un bubble flotante en la esquina inferior.
3. Pulsa, escribe “hola, quiero reservar”.
4. El bot debe responder y guiar la reserva.

Si no aparece, abre la consola del navegador y busca errores. El error más común es un data-slug incorrecto.

Próximo paso

Quieres que el bot también atienda WhatsApp? → Conectar WhatsApp