Para poner un botón de WhatsApp en tu web alcanza con un link https://wa.me/ dentro de un botón flotante: unas pocas líneas de HTML que podés pegar en cualquier página. Acá abajo armá el código de un botón flotante de WhatsApp con tu número argentino, un mensaje precargado opcional, la posición (derecha o izquierda) y el estilo (con texto o sólo ícono). Ves la vista previa en la misma nota, copiás el código y lo pegás. Después, dónde pegarlo en HTML, Tienda Nube, WordPress y Wix.
Generador de botón de WhatsApp
Configurá tu botón
El generador funciona en tu navegador: el número y el mensaje no se envían ni se guardan en ningún lado. El «9» después del 54 lo agrega solo, y el mensaje lo codifica con encodeURIComponent, así que las tildes, los signos y los saltos de línea viajan bien dentro del link. El código que obtenés no usa librerías ni scripts: es un enlace con estilos en línea y un ícono dibujado en SVG.
Cómo funciona el botón
El botón es un enlace común que apunta a WhatsApp. La ayuda oficial define el formato así: «Usa https://wa.me/<number> (<number> es un número de teléfono completo en formato internacional). No incluyas ceros, paréntesis ni guiones cuando añadas el número de teléfono en este formato». Para Argentina, WhatsApp pide el 9 entre el 54 y el código de área, y que no lleve el 15: «El prefijo "15" se debe eliminar para que el número final tenga 13 dígitos en total». Un celular de Buenos Aires que anotás como 011 15 XXXX-XXXX queda 54911XXXXXXXX. Si querés ver el paso a paso del número, está en la nota del link de WhatsApp (wa.me).
Para que el chat se abra con un texto escrito se agrega ?text= y el mensaje codificado. La persona toca el botón, ve el mensaje ya cargado y lo envía ella. No hace falta que tenga tu número agendado.
Cómo hacerlo a mano
Si preferís no usar el generador, copiá este código y cambiá lo que está entre corchetes. El número va completo (54, 9, código de área sin 0 y número sin 15) y el mensaje, con los espacios como %20 y los signos codificados:
<a href="https://wa.me/54911XXXXXXXX?text=Hola%2C%20quiero%20hacer%20una%20consulta"
target="_blank" rel="noopener noreferrer"
aria-label="Escribinos por WhatsApp"
style="position:fixed;bottom:20px;right:20px;z-index:9999;display:flex;align-items:center;gap:8px;background:#1f7a45;color:#ffffff;font:600 16px/1 Arial,Helvetica,sans-serif;text-decoration:none;padding:14px 20px;border-radius:999px;box-shadow:0 4px 12px rgba(0,0,0,.25)">
<svg width="24" height="24" viewBox="0 0 24 24" aria-hidden="true" focusable="false"><path fill="#ffffff" d="M4 4h16a2 2 0 0 1 2 2v9a2 2 0 0 1-2 2H10l-5 4v-4H4a2 2 0 0 1-2-2V6a2 2 0 0 1 2-2z"/></svg>
<span>Escribinos por WhatsApp</span>
</a>Tres detalles que evitan errores: target="_blank" va siempre con rel="noopener noreferrer"; el aria-label le da nombre al botón cuando es sólo ícono (lo leen los lectores de pantalla); y z-index:9999 lo deja por encima del resto de la página. Para llevarlo a la izquierda, cambiá right:20px por left:20px.
Dónde pegar el código
En una página HTML propia
Pegá el bloque justo antes de la etiqueta de cierre </body> de cada página donde quieras el botón. Si tu sitio usa una plantilla común (un pie compartido), pegalo ahí una sola vez y aparece en todas.
En Tienda Nube
Antes de pegar código, mirá si te alcanza el botón propio de la tienda. La ayuda oficial indica que se activa desde el administrador, en Configuración > Botón de WhatsApp, cargando el teléfono y dejando tildada la casilla «Mostrar un botón en tu tienda para que puedan escribirte por WhatsApp». Esa misma ayuda trae un CSS para cambiar el tamaño y la posición de ese botón flotante. La ayuda de Tienda Nube que revisamos no documenta cómo pegar HTML propio en el tema: si querés usar el código de esta nota, consultalo con el soporte de Tienda Nube o con quien desarrolló tu diseño.
En WordPress
La documentación oficial describe el bloque HTML personalizado: lo agregás desde el insertador de bloques o escribiendo /html en un párrafo nuevo, pulsás «Edit HTML», pegás el código y apretás «Update». Ahí mismo ves una vista previa. Un aviso de la propia documentación: si tu usuario no tiene la capacidad unfiltered_html (por ejemplo, un colaborador), WordPress limpia el contenido del bloque y elimina las etiquetas no permitidas; si el botón no aparece, revisá con un usuario administrador. El bloque queda en esa página; para que salga en todo el sitio hace falta cargarlo en una zona común del tema.
En Wix
Según la ayuda oficial de Wix, entrás a Ajustes, luego a Desarrollo e integraciones > Código personalizado, hacés clic en «Agregar código personalizado», pegás el fragmento y le ponés un nombre. En «Agregar código a las páginas» elegís todas o algunas, y en «Coloca el código en», Cuerpo - final. Aclaran que el sitio debe estar publicado y tener un dominio conectado, y que Wix no da soporte técnico para fragmentos de terceros.
El ícono y la marca WhatsApp
El ícono del generador es un globo de diálogo simple, dibujado para esta nota: no es el logo de WhatsApp ni una copia. Es a propósito. Las pautas de marca de Meta indican que sólo se pueden usar los recursos oficiales de su sitio de marca, que los logos no se modifican ni se les cambian los colores, y que no se usen imágenes confundibles con el logo del teléfono. Si querés el logo oficial en tu botón, descargalo de ese sitio y seguí sus reglas. Esas pautas también piden escribir el nombre correctamente («WhatsApp») y no sugerir que la empresa te patrocina o respalda: por eso el texto del botón dice «Escribinos por WhatsApp» y nada más. El color es el que elijas; el predeterminado es un verde propio, no el de la marca.
Cuándo conviene pasar del botón a un CRM con varios agentes
El botón trae consultas a un solo número. Con una persona atendiendo alcanza. Conviene dar el salto cuando:
- atienden dos o más personas y nadie sabe a quién le contestó quién;
- quedan chats sin responder fuera de horario o en los picos;
- necesitás el historial de cada cliente a la vista de todo el equipo;
- querés repartir las conversaciones entre áreas (ventas, administración, soporte).
Para eso está Qomunica, el CRM de WhatsApp: conecta tu número a un inbox compartido donde cada conversación tiene un estado (atendida por el bot, tomada por un asesor o finalizada) y el historial queda completo. El botón de esta nota sigue sirviendo igual: el link apunta a tu número y las consultas entran al inbox. Se prueba gratis durante 7 días. Si primero necesitás el link para otros lugares (Instagram, firma de correo), usá el generador de link de WhatsApp, o el código QR de WhatsApp para el local.
Preguntas frecuentes
¿Cómo pongo un botón de WhatsApp en mi página web?
Generá el código con la herramienta de esta nota y pegalo antes de la etiqueta de cierre del cuerpo de tu página. En Tienda Nube, WordPress y Wix cambia dónde se pega; los pasos están más arriba.
¿Cómo escribo mi número argentino en el botón?
54, un 9, el código de área sin el 0 y el número sin el 15, todo junto y sin espacios. Si contás 13 dígitos, está bien.
¿Puedo hacer que el botón abra el chat con un mensaje escrito?
Sí. Se agrega ?text= y el mensaje codificado al final del link. El generador lo hace solo. La persona lo ve en el cuadro de texto y lo envía ella.
¿Cuesta algo usar el botón?
El formato wa.me es una función oficial de WhatsApp y el código de esta nota no usa servicios de terceros. No hay costo por generarlo ni por pegarlo.
¿Puedo usar el logo de WhatsApp en el botón?
Sólo el oficial, descargado del sitio de recursos de marca de Meta y sin modificarlo. El ícono de este generador es propio y no imita al logo.
Fuentes
Ayuda oficial de WhatsApp: Cómo usar la función de clic para chatear y formato internacional de número de teléfono. Meta: WhatsApp brand assets and guidelines. Tienda Nube: cómo agregar el botón de WhatsApp. WordPress: bloque Custom HTML. Wix: incrustar código personalizado en tu sitio. Revisado el 2 de noviembre de 2026; los menús de cada plataforma pueden cambiar. Q Company.
