Cómo poner un botón de WhatsApp en mi sitio web?

PorAndrés Gómez

Cómo poner un botón de WhatsApp en mi sitio web?

WhatsApp se ha convertido sin lugar a dudas en la herramienta de comunicación predilecta no solo para temas personales sino en todo ámbito y con más veras para lograr un contacto directo entre vendedores y compradores, por esta razón tener un botón de WhatsApp en tu sitio es imprescindible.

Hoy te queremos enseñar cómo (con un conocimiento básico de HTML) podrás incorporar un botón flotante con acceso directo al chat de WhatsApp en tu web.

Dentro de las etiquetas <body> … </body> de tu sitio web deberás incluir el siguiente código:

<div style=”position:fixed;bottom:20px;right:20px;z-index:1000″><a href=”https://api.whatsapp.com/send?phone=571111111111″ target=”_blank”><img src=”images/whatsapp.png” width=”64″></a></div>

htmlwp

Explicación:

Se creará un elemento DIV con posición fija en tu página HTML alineado a la derecha y en la esquina inferior.

Deberás reemplazar el fragmento phone=571111111111 por tu número de teléfono asociado a WhatsApp, se ha incluido el número 57 que es el código para colombia. El target=”_blank” abrirá el enlace en una pestaña nueva.

Finalmente deberás reemplazar en src=”images/whatsapp.png” por el directorio en donde tengas alojada la imagen correspondiente al icono de whatsapp.

El resultado será:

whatsapp-boton

Y al hacer clic sobre él te llevará directamente a la ventana de chat de WhatsApp!

Sobre el autor

Andrés Gómez

Ingeniero de Sistemas, Fundador de ConexionGrafica - Taller Creativo, donde me he trazado el objetivo de crear estrategias digitales para que personas y pymes tengan una presencia efectiva en internet.