Botón de WhatsApp para tu página web: genera el código gratis

Actualizado el 7 de octubre de 2026 · Revisado por Alejandro Díaz, CEO de Agent IA SAS

Con este generador agregas a tu sitio el botón verde de WhatsApp que se queda fijo en una esquina mientras el visitante navega. Configuras el número, el mensaje con el que llega el cliente, el texto del botón, el color y el lado de la pantalla; ves la vista previa y copias el código.

Es gratis y no necesitas plugins. El código no depende de nuestros servidores: una vez pegado, el botón sigue funcionando aunque no vuelvas a esta página. Si lo que necesitas es solo el enlace, usa el generador de links de WhatsApp.

Cómo agregar el botón de WhatsApp a tu página web en 3 pasos

El proceso completo toma un par de minutos:

• Escribe tu número y el mensaje inicial; uno con contexto, como «Hola, vengo de su página web», ayuda a tu equipo a saber de dónde llega el cliente.
• Elige el texto del botón (o déjalo vacío para mostrar solo el ícono), el color y si va a la derecha o a la izquierda.
• Copia el código y pégalo en tu sitio justo antes de la etiqueta </body>, en todas las páginas donde quieras que aparezca.

Cómo instalar el botón en WordPress, Shopify, Wix y HTML

Cada plataforma tiene un lugar para código propio al final de la página:

• WordPress: con un plugin para insertar código en el encabezado y el pie, como WPCode, pega el código en la sección del pie (footer). En temas de bloques también puedes usar un bloque HTML personalizado en la parte del pie de la plantilla.
• Shopify: en Tienda online, Temas, abre el menú del tema y elige Editar código; en el archivo layout/theme.liquid pega el código justo antes de </body> y guarda.
• Wix: en la configuración del sitio, en Código personalizado, agrega el código en la posición del cuerpo, al final, y aplícalo a todas las páginas. Wix pide un plan Premium con dominio conectado para esta opción.
• HTML: pega el código antes de </body> en la plantilla común o en cada página.

Botón de WhatsApp o chat con IA en tu web: diferencias

Los dos sirven para que el visitante pregunte; cambia dónde ocurre la conversación y quién responde:

• En SoyAgentia el chat para el sitio está incluido en los planes: lee chatbot para página web, chatbot para WordPress o chatbot para Shopify.

Buenas prácticas para el botón de WhatsApp

Detalles que hacen que el botón traiga conversaciones útiles y no estorbe:

• Revisa la vista en celular: si el botón tapa el carrito, un banner de cookies u otro chat, cámbialo de lado.
• Usa un mensaje inicial distinto en las páginas clave, por ejemplo en la de precios, para saber qué estaba mirando el cliente.
• Si nadie atiende de noche, dilo en la página o conecta un agente de IA: un botón que no responde quita más ventas de las que trae.
• Mide los clics con la herramienta de analítica de tu sitio, contando los clics a enlaces que empiezan por https://wa.me/.

Qué pasa cuando el visitante toca el botón

El visitante sale de tu web hacia WhatsApp con el mensaje escrito, y espera respuesta en minutos. Con SoyAgentia, un agente de IA responde en ese chat a toda hora sobre la API oficial de WhatsApp: entiende texto libre, busca en tu catálogo, agenda en Google Calendar y pasa la conversación a una persona de tu equipo con aviso cuando hace falta. Más detalles en agentes de IA para WhatsApp.

Sigue leyendo

• Generador de links de WhatsApp
• Generador de código QR de WhatsApp
• Chatbot para página web
• Chatbot para WordPress
• Chatbot para Shopify
• Captar leads en tu sitio web con IA

Preguntas frecuentes