Botón flotante de WhatsApp para tu web

Configura, mira la vista previa y copia el código. HTML + CSS puros: no usa JavaScript ni scripts de terceros, y pesa menos de 2 KB.

Esto es el botón que lleva a tu WhatsApp. Si lo que querés es que tus visitantes armen su propio link sin salir de tu página, eso es el widget para tu sitio.

Dónde se pega el código, por plataforma

El código va siempre antes de </body>. Lo que cambia es el camino de menús en cada plataforma y lo que filtra cada plan. Los menús están verificados en la ayuda oficial de cada una; en la guía está el paso a paso con las fuentes.

PlataformaDónde se pegaOjo con
WordPressBloque «HTML personalizado». En una página: el editor. En todo el sitio: Apariencia → Editor (tema de bloques) o Apariencia → Widgets (tema clásico).WordPress.com gratuito borra el <svg> al guardar: el círculo queda verde y sin ícono. Ahí conviene el botón inline con texto de la guía.
ShopifySin tocar código: una sección o bloque «Liquid personalizado» desde Personalizar. Para todo el sitio: Tienda online → Temas → ⋯ → Editar código → layout/theme.liquid, antes de </body>.La sección «Liquid personalizado» vive solo en la página donde la agregás; para toda la tienda, theme.liquid. El checkout no se edita desde el tema.
TiendanubePrimero el botón nativo: Configuración → Botón de WhatsApp. Para código propio: Tienda online → Diseño → Editar el código (FTP), en la plantilla Layout.tpl. «Códigos externos» NO es el lugar.Si ya activaste el botón nativo, no pegues este: dos botones de WhatsApp confunden.
WixPanel de control → Ajustes → Código personalizado (Desarrollo e integraciones) → + Agregar código personalizado → Todas las páginas → Cuerpo - final.«Código personalizado» exige el sitio publicado con dominio conectado (plan Premium o Wix Studio). En el plan gratuito no hay dónde pegarlo para todo el sitio.
HTML puroEn el archivo de cada página (o en la plantilla/pie compartido), justo antes de </body>.—

Guías relacionadas

Preguntas frecuentes

¿Cómo agrego el botón de WhatsApp a mi página web?

Copia el código que genera esta herramienta y pégalo antes del cierre de de tu sitio. Funciona en cualquier web: HTML propio, WordPress (bloque «HTML personalizado»), Shopify (sección «Liquid personalizado» o theme.liquid), Wix (Ajustes → Código personalizado) o Tiendanube (que además trae un botón nativo). El camino exacto de menús y los límites de cada plan están en la guía por plataforma.

¿El botón funciona en celular y computadora?

Sí: en el celular abre la app de WhatsApp y en escritorio abre WhatsApp Web. El link wa.me decide solo.

¿Puedo cambiar el color o la posición?

Sí: el código usa variables claras (posición izquierda/derecha, margen y color). El verde estándar #25D366 es el que la gente reconoce — recomendamos no cambiarlo.

¿Afecta la velocidad de mi página?

No: es HTML y CSS puros (sin JavaScript ni librerías externas), pesa menos de 2 KB y no hace peticiones a terceros.