¿Quién no usa WhatsApp hoy en día? WhatsApp es la app de comunicación instantánea más popular, con más de 2.000 millones de usuarios activos. Por eso, cada vez son más las empresas que integran WhatsApp en su web para facilitar el contacto con los clientes. Pero ¿Cómo se puede añadir el botón de WhatsApp en WordPress? ¡Te lo contamos!

¿Por qué debería implementar WhatsApp en mi WordPress?

Para que tu web tenga éxito es fundamental que existan canales de comunicación mediante los que los usuarios puedan ponerse en contacto contigo. Tradicionalmente, los canales más habituales eran el formulario de contacto, la dirección de email y el teléfono, pero cada vez es más habitual encontrar otras vías de contacto como chatbot o WhatsApp.

Cuanto más, mejor. Estamos acostumbrados al “menos es más” pero en el caso de las comunicaciones, ¡olvídate de ello! Cuantas más facilidades de comunicación des al usuario, más probabilidades de que te contactes tendrás. ¿Y qué más fácil y cómodo que enviar un WhatsApp? Es una app que todos tenemos en nuestro teléfono, instantánea y sin necesidad de estar hablando por teléfono porque, reconozcámoslo, a la mayoría nos da pereza eso de estar llamando y teniendo que esperar que el departamento adecuado te atienda.

Esto es especialmente cuando tu negocio se basa en la captación de leads o contactos, pero no deja de ser importante en el ámbito del comercio electrónico. ¿Cuántas veces te ha surgido una duda en medio de una compra y has abandonado el carrito porque no encontrabas la respuesta? Es cierto que esto podría formar parte de lo que se conoce como CRO (Conversion Rate Optimization), pero si das la facilidad al usuario de que se ponga en contacto con tu tienda online de manera rápida y sencilla, será mucho más fácil que conviertan ¡así de simple!

Cómo poner botón de WhatsApp en WordPress con plugin

Lo más sencillo, sobre todo si no controlas demasiado de HTML y CSS es implementar botón de WhatsApp mediante plugin. En WordPress existen muchos plugin para integrar tanto WhatsApp como otros canales de contacto como chatbots, pero desde Online Zebra te vamos a contar cuáles son los que más nos gustan a nosotros.

Lo que hacen estos plugins es añadir el botón de WhatsApp en nuestra web. El icono de WhatsApp se mostrará de manera fija en la pantalla, de manera que siempre será visible mientras el usuario navega. De esta manera se facilita el contacto.

JoinChat

JoinChat es un plugin para WordPress que, en su versión gratuita, te permite integrar WhatsApp de manera sencilla y customizar alguna cosilla interesante. Pero si algo nos gusta de JoinChat es que no tienes que hacer nada para registrar los eventos en Google Analytics: comienza a registrarlos de manera automática.

Lo primero que debes hacer, como siempre, es instalar el plugin. Para ello, accede al repositorio de plugin y busca JoinChat o descárgalo desde aquí. Una vez activado, vamos a la configuración.

Busca en el menú de administración de WordPress el plugin: Join.chat y entra.

Al acceder, verás varias pestañas que te permitirán configurar y customizar tu botón de WhatsApp. ¡Comenzamos!

Customizar WhatsApp

Para ajustar lo básico y customizar el mensaje, entraremos en Menú General.

Lo primero que te encontrarás será con el número de teléfono y el mensaje que quieres que aparezca de manera predeterminada en el WhatsApp del usuario cuando comienza la conversación. Esto resulta útil para indicar al usuario qué tipo de mensaje esperamos de él. Por ejemplo, si estamos en el sector servicios, posiblemente esperamos que el usuario solicite una visita o consulte información sobre un servicio. Si estamos en un ecommerce, quizá esperamos que el usuario nos pregunte por un producto. Así, podemos poner «¡Hola! Quiero concertar una cita» como mensaje predeterminado. No obstante, este mensaje no se manda automáticamente, sino que el usuario puede modificarlo antes de enviarlo.

Pero no solo eso, podemos usar variables que irán modificándose según desde dónde se comience el chat. Las variables que podemos agregar son {SITE} {TITLE} {URL} {HREF}.

Por ejemplo, podemos hacer que si el usuario está iniciando el chat desde la página SEO, el mensaje sea «¡Hola! Me gustaría tener más información sobre el servicio de SEO». A continuación te ponemos el ejemplo:

La Información emergente, por otro lado, es un bocadillo que se mostrará junto al botón de WhatsApp. Si no pones nada, simplemente, no aparecerá.

En Posición en pantalla, puedes elegir si quieres que el icono aparezca a la izquierda o a la derecha en la pantalla. Por norma general, se suelen poner a la derecha por lo que recomendamos que así sea, ya que es ahí donde el usuario espera que aparezca. Además, puedes elegir el retardo de aparición el botón de WhatsApp. En este sentido, siempre es mejor que aparezca con cierto retardo (3 segundos está bien) porque la aparición de elementos nuevos capta la atención. Si quieres que el botón de WhatsApp solo se muestre en móvil, solo tienes que hacer un clic. Más sencillo, imposible.

Mostrar WhatsApp solo en algunas páginas

Otro de los aspectos destacables de Joinchat es la opción de elegir dónde queremos que aparezca el botón de WhatsApp y dónde no. Por ejemplo, puede que no queramos que el botón aparezca en las páginas de blog, solo tendremos que clicar sobre el botón del ojo tachado y ¡listo!

Consentimiento de usuarios

Si además necesitas tener el consentimiento del usuario para cumplir con las normas de protección de datos y asegurarte de que te autorizan para recibir mensajes tuyos, puedes hacerlo desde el apartado Avanzado, donde además puedes meter la etiqueta de conversión de Google Ads si haces campañas de SEM.

En unos pocos minutos, tendrás añadido el botón de WhatsApp en tu web y estarás listo para recibir mensajes de tus clientes ¡Leads, venid a mi!

Cómo poner el botón de WhatsApp en WordPress sin plugin

Si no quieres meter plugin adicionales a tu WordPress, puedes hacerlo mediante el método manual. En este caso, tenemos dos opciones:

• Poner el enlace de WhatsApp en una imagen o texto ancla
• Poner un botón de WhatsApp fijo en alguna parte de la página

Poner enlace de WhatsApp en un texto ancla o imagen

Si no tienes muchos conocimientos de CSS y HTML, esta es la manera más sencilla de integrar WhatsApp en tu WordPress sin necesidad de plugin.

Solo debemos saber al número de teléfono que queremos que se envíen los mensajes y generar una URL siguiendo la siguiente estructura:

Una vez formada la URL, solo debes elegir dónde quieres colocar el botón a WhatsApp. Puede ser una imagen o un texto y el método de inserción del enlace es el mismo que en cualquier otro enlace.

Insertar enlace a WhatsApp en un enlace

En WordPress, agregar enlaces de lo más sencillo. Si estás en el editor clásico (ahora Gutenberg), solo tienes que seleccionar el texto ancla y meter el enlace generado anteriormente.

Si quisiéramos añadir el texto directamente en HTML, sin ayuda del constructor de WordPress, deberíamos meter un código como el siguiente:

Al código anterior, además le hemos añadido la clase CSS «whatsapp», por lo que podremos aplicar diferentes estilos mediante CSS, como mostrarlo únicamente en móvil y ocultarlo en PC.

Insertar enlace a WhatsApp en una imagen

Como al insertar un enlace en un texto, lo que debemos hacer es elegir la imagen donde queremos incluir el enlace a WhatsApp.

Aquí metemos el enlace a la imagen

Podemos meter una clase CSS a una imagen para poder añadirle estilos (como ocultarla para dispositivo ordenador) entrando en Detalles de la imagen > Opciones avanzadas

Un buen ejemplo en el que solemos hacer uso de este método es poner un enlace en el topbar o en el footer de la web. En este caso, lo que hacemos es subir una imagen con el icono de WhatsApp  o un texto ancla que diga, por ejemplo, «Contáctanos por WhatsApp».

Insertar botón de WhatsApp fijo en WordPress sin plugin

Aunque el anterior método es más sencillo, lo cierto es que el CTR al botón mejora cuando el método de contacto se hace más visible, como cuando lo tenemos en un sitio de la pantalla y se mantiene fijo durante la navegación. Por eso, te vamos a enseñar cómo hacerlo sin plugin.

1. Subir imagen de WhatsApp

Lo primero que tenemos que hacer es subir la imagen de WhatsApp a nuestro WordPress. Añádela directamente desde Medios y apúntate la URL de la ubicación.

2. Creamos el botón de WhatsApp

Una vez tengas la URL de la ubicación en la que se encuentra la imagen, deberás meterla en el tema. Nuestra recomendación es que lo hagas en el footer. Para ello, tendrás que acceder al archivo footer.php. Puedes hacerlo a través del FTP o desde el editor de temas. Nuestra recomendación es que lo hagas a través de FTP y que, antes de nada, te hagas una copia del archivo, además de un backup completo que incluya la base de datos.

Para acceder a footer.php desde FTP, deberás acceder a la siguiente ruta: wp-content/themes /[tema-activo]/footer.php. Una vez ahí, nos colocaremos encima de </body> y meteremos la imagen con el enlace a WhatsApp.

3. Le damos estilos

Ahora tendremos que darle estilos al botón. Para ello, debemos acceder al CSS personalizado de nuestro WordPress. Hay varias opciones para hacer esto. Podemos hacerlo desde style.css en el editor de temas, o mediante Apariencia > Personalizar > CSS adicional.

Ahí, podemos darle estilos a la clase declarada (.whatsapp) para que el botón se muestre de manera fija y encima del resto de elementos de la web. Este sería el código CSS base:

¡Listo para usar!

Como ves, hay muchas opciones para agregar WhatsApp a tu WordPress. Eso sí, si añades algún canal de comunicación, asegúrate de tener capacidad para atenderlo correctamente. De nada sirve tener un montón de leads si luego no puedes responder correctamente. Solo conseguirás una mala experiencia de usuario y desprestigio de marca.

¿Qué método te parece más útil? ¿Conoces alguna otra manera de integrar WhatsApp en WordPress? ¡Cuéntanoslo!