Botón de WhatsApp en WordPress — Cómo Ponerlo y Que Convierta
Un botón de WhatsApp en tu web de WordPress puede ser tu mejor vendedor. Trabaja 24/7, no pide comisión y convierte visitantes curiosos en conversaciones reales. El truco está en configurarlo bien — no solo ponerlo.
Key Takeaways
- El botón flotante en la esquina inferior derecha es el estándar que funciona
- Un mensaje predeterminado triplica la calidad de las conversaciones
- Plugins como Join.chat o Social Chat te dan analytics sin código
- Sin plugin también se puede — un link de WhatsApp + CSS y listo
- Genera tu link perfecto en wplink.app antes de instalar cualquier cosa
¿Por Qué Poner un Botón de WhatsApp en WordPress?
Los números hablan solos.
- WhatsApp tiene 2,000 millones de usuarios activos mensuales
- En Latinoamérica, el 93% de los usuarios de smartphone usan WhatsApp
- Los mensajes de WhatsApp tienen una tasa de apertura del 98%
- Las conversiones por WhatsApp son hasta 5x mayores que por formulario web
Un formulario de contacto dice "te responderemos pronto". Un botón de WhatsApp dice "hablemos ahora". La diferencia en tasa de conversión es brutal.
Antes de Empezar: Genera tu Link
No instales nada sin tener tu link de WhatsApp listo. Ve a wplink.app y genera tu link con:
- Tu número completo con código de país
- Un mensaje predeterminado relevante (ej: "Hola, me interesa saber más sobre sus servicios")
Guarda ese link. Lo vas a necesitar para cualquier método.
Opción 1: Plugin Join.chat (Recomendado)
El plugin más completo y popular para WhatsApp en WordPress. Gratis con versión premium.
Instalación
- WordPress Admin → Plugins → Añadir nuevo
- Busca "Join.chat" (o "Joinchat")
- Instala → Activa
- Ajustes → Joinchat
Configuración que Convierte
Pestaña General:
- Número: tu número con código de país (sin + ni espacios)
- Mensaje: "Hola 👋 ¿En qué podemos ayudarte?"
- Posición: inferior derecha
Pestaña Visibilidad:
- Mostrar en: todas las páginas (o selecciona específicas)
- Dispositivos: desktop y mobile
- Delay: 3 segundos (no mostrar inmediatamente — deja que el usuario respire)
Pestaña Avanzado:
- Call to Action: "¿Tienes dudas? Escríbenos"
- Tooltip: activo
- Burbuja: con notificación (el punto rojo atrae la mirada)
Analytics Integrados
Join.chat trackea automáticamente los clics en Google Analytics 4. Cada clic al botón es un evento joinchat que puedes ver en GA4 → Eventos. Sin configuración adicional.
Opción 2: Botón de WhatsApp sin Plugin
Si prefieres cero plugins extra — porque cada plugin es peso — usa CSS puro.
Código HTML + CSS
Pega esto en Apariencia → Personalizar → CSS adicional y un widget HTML:
Widget HTML (en el footer):
<a id="wa-btn" href="TU_LINK_DE_WPLINK_APP" target="_blank" rel="noopener">
<svg viewBox="0 0 32 32" width="24" height="24" fill="white">
<path d="M16.004 0h-.008C7.174 0 0 7.176 0 16.004c0 3.5 1.128 6.744 3.046 9.378L1.054 31.29l6.118-1.962A15.91 15.91 0 0016.004 32C24.826 32 32 24.826 32 16.004S24.826 0 16.004 0z"/>
</svg>
WhatsApp
</a>
CSS Adicional:
#wa-btn {
position: fixed;
bottom: 20px;
right: 20px;
background: #25D366;
color: white;
padding: 12px 20px;
border-radius: 50px;
text-decoration: none;
font-weight: 600;
font-size: 15px;
display: flex;
align-items: center;
gap: 8px;
z-index: 9999;
box-shadow: 0 4px 15px rgba(37, 211, 102, 0.4);
transition: transform 0.2s, box-shadow 0.2s;
}
#wa-btn:hover {
transform: scale(1.05);
box-shadow: 0 6px 20px rgba(37, 211, 102, 0.5);
}
Reemplaza TU_LINK_DE_WPLINK_APP con el link generado en wplink.app. Resultado: un botón flotante profesional, sin un solo plugin.
Opción 3: Botón de WhatsApp en Páginas Específicas
No siempre quieres el botón en todas las páginas. En la página de un producto, sí. En tu política de privacidad, no.
Con Elementor
- Edita la página con Elementor
- Arrastra un widget "Botón"
- Texto: "💬 Consultar por WhatsApp"
- Link: tu link de wplink.app
- Estilo: fondo verde #25D366, texto blanco, bordes redondeados
Con el Editor de Bloques (Gutenberg)
- Agrega un bloque "Botones"
- Escribe el texto del botón
- Pega tu link de WhatsApp
- Ajusta colores desde la barra lateral
Configuraciones que Aumentan las Conversiones
1. Mensaje Predeterminado Contextual
No uses el mismo mensaje en toda la web. Personaliza por página:
- Página de servicios: "Hola, me interesa el servicio de [X]. ¿Podrían darme más información?"
- Página de producto: "Hola, quiero consultar sobre [producto]. ¿Está disponible?"
- Pricing: "Hola, me interesa el plan [X]. ¿Podemos hablar?"
2. Horario de Atención Visible
Muestra junto al botón: "Respondemos de L-V 8am-6pm". Evita la frustración de mensajes sin respuesta.
3. Foto del Agente
Los plugins como Join.chat permiten mostrar la foto de quien atiende. Humaniza la interacción.
4. Animación Sutil
Una pulsación suave (CSS animation: pulse) llama la atención sin molestar.
¿Necesitas Hosting para tu WordPress?
Si estás montando tu WordPress desde cero, Hostinger tiene planes desde $2.99/mes con WordPress preinstalado, dominio gratis y rendimiento sólido. En minutos tienes tu web lista para agregar el botón de WhatsApp.
Preguntas Frecuentes
¿El botón de WhatsApp ralentiza mi web?
Un link manual o CSS puro no agrega peso. Plugins como Join.chat suman ~50KB — imperceptible. Evita plugins que carguen scripts pesados o iframes innecesarios.
¿Funciona el botón de WhatsApp en celulares y computadoras?
Sí. En celulares abre la app de WhatsApp directamente. En computadoras abre WhatsApp Web o la app de escritorio. El link wa.me es universal.
¿Puedo poner botones de WhatsApp para diferentes departamentos?
Sí. Con plugins como Join.chat puedes configurar múltiples agentes, cada uno con su número y departamento. El usuario elige con quién hablar.
¿Cómo mido cuánta gente hace clic en el botón?
Con Join.chat + GA4, los clics se trackean automáticamente. Sin plugin, configura un evento personalizado en Google Tag Manager para el link de WhatsApp.
¿Es mejor un botón flotante o un botón dentro del contenido?
Ambos. El botón flotante captura al usuario en cualquier momento. El botón dentro del contenido aparece en el contexto perfecto (junto al precio, al final de una descripción). Usa los dos.
Conclusión
Un botón de WhatsApp en WordPress no es un accesorio — es un canal de ventas. La diferencia entre un botón que convierte y uno que nadie toca está en los detalles: mensaje predeterminado, posición correcta, contexto relevante.
Genera tu link en wplink.app, elige tu método de instalación y empieza a convertir visitas en conversaciones. Tu próximo cliente puede estar a un clic de distancia.