Vista previa en vivo
El código exacto que copias se muestra en una página de ejemplo mientras lo editas.
Botón de chat de WhatsApp gratis para webs
Generador de widget de WhatsApp para tu web
Diseña un botón flotante de WhatsApp, míralo en vivo en una página de ejemplo y copia un pequeño fragmento de HTML. Funciona en WordPress, Shopify, Wix, Squarespace, Webflow o webs hechas a mano, sin plugins, sin scripts externos y sin rastrear a tus visitantes.
Incluye el prefijo del país. Puedes usar espacios, guiones y un + inicial.
La persona ve este texto en WhatsApp y puede editarlo antes de enviarlo. No se envía nada automáticamente.
Código para insertar: pégalo antes de </body>
Introduce un número de WhatsApp para generar el código.
Gratis, sin registro. Se genera en tu navegador: nada de lo que escribes se envía a MyChatWrap.
¿Qué es un widget de WhatsApp para web?
Un widget de WhatsApp es un botón fijo en una esquina de tu web que, al pulsarlo, abre un chat de WhatsApp con tu negocio. Este generador crea HTML y CSS puros: un enlace wa.me con estilo y una burbuja de saludo opcional. Como no carga nada de otros servidores, apenas pesa, no puede ralentizar tu web y no necesita banner de cookies.
Un botón de chat ligero y bajo tu control
Sin scripts ni seguimiento
HTML y CSS puros, alrededor de 1 KB, sin peticiones a terceros ni cookies.
Texto y color a tu gusto
Usa un texto como «Escríbenos» o un botón redondo solo con icono en el color de tu marca.
Burbuja de saludo
Un mensaje opcional sobre el botón invita a empezar a chatear.
Pensado para móvil
Opcionalmente se reduce a un icono en móviles para no tapar tu contenido.
Accesible de serie
Incluye estilos de foco para teclado y una etiqueta para lectores de pantalla.
Cómo añadir WhatsApp a tu web
1. Escribe tu número
Añade tu número de WhatsApp o WhatsApp Business con el prefijo del país.
2. Diseña el botón
Define el texto, el saludo, el color, la posición y el mensaje predefinido.
3. Pega el código
Copia el fragmento y pégalo justo antes de </body> en tu web.
Dónde pegar el código
Pega el fragmento una sola vez en un lugar que se cargue en todas las páginas:
- WordPress: un plugin de código para cabecera/pie, o el footer.php de tu tema antes de </body>
- Shopify: Tienda online → Temas → Editar código → theme.liquid, antes de </body>
- Wix: Ajustes → Código personalizado → Final del body, en todas las páginas
- Squarespace: Ajustes → Avanzado → Inyección de código → Pie de página
- Webflow: Ajustes del proyecto → Custom code → Footer code
- Cualquier web HTML: justo antes de la etiqueta de cierre </body>
¿Por qué un widget de HTML puro?
La mayoría de plugins de chat cargan JavaScript desde el servidor de otra empresa en cada visita. Eso añade peso, puede instalar cookies de seguimiento y deja de funcionar si el servicio cambia sus planes. Este fragmento es un enlace con estilo: si tu página carga, el botón funciona.
La contrapartida es que no incluye estadísticas de clics. Usa un mensaje predefinido distinto, como «Hola, vengo de vuestra web», para saber qué chats llegan desde el widget.
Cómo hacer que el botón convierta
Di qué pasará al pulsarlo («Escríbenos», «Haz una pregunta») en lugar de mostrar solo un icono, mantén el saludo breve y cercano, y predefine un mensaje para que nadie se encuentre con una caja vacía. En móvil, un botón solo con icono no tapa fotos de producto ni botones de pago.
Qué hace esta herramienta
- Genera un botón flotante de WhatsApp en HTML/CSS puro
- Muestra una vista previa en vivo del fragmento exacto
- Permite texto, color, saludo, posición y opciones para móvil
- Valida tu número antes de publicar
Qué no puede hacer
- Ofrecer chat en vivo, chatbots ni una bandeja compartida para equipos
- Contar clics o visitas: no lleva seguimiento a propósito
- Instalarse solo: tienes que pegar el fragmento en tu web
Generado de forma privada en tu navegador
Todo en esta página se genera en tu navegador. El número, el mensaje y los ajustes que escribes no se envían a MyChatWrap ni se guardan en ningún sitio. Solo sale de tu dispositivo lo que tú decidas copiar, descargar o publicar.
Preguntas sobre el widget de WhatsApp
Otras herramientas de WhatsApp
Generador de enlaces de WhatsApp
Crea un enlace wa.me para chatear con un clic, con mensaje predefinido y listo para copiar.
Generador de códigos QR de WhatsApp
Crea un código QR de WhatsApp para chatear al escanear, con colores propios, en PNG o SVG listo para imprimir.
Plantillas de mensajes de WhatsApp
Rellena mensajes de WhatsApp Business ya escritos para pedidos, recordatorios, ofertas y más.
WhatsApp to PDF
¿Necesitas todos los mensajes? Crea un PDF con la transcripción cronológica completa.
¿Ya hablas con clientes por WhatsApp?
Exporta un chat con clientes o con tu equipo y descubre tiempos de respuesta, horas punta, quién inicia las conversaciones y más, analizado de forma privada en tu navegador.
Analizar un chat de WhatsApp