Ejemplos de WhatsApp Widget, Enlace a WhatsApp

WhatsApp link para HTML

whatsapp link html

Si deseas crear un botón HTML puro para tu sitio web HTML, este es el mejor código que puede utilizar. Si tiene un sitio web HTML o PHP … debes agregar tu código directamente a tu sitio web. Con este código puede agregar un botón para tu número de WhatsApp directamente en su sitio web.

🐝 Traducciones disponibles en:

El código HTML para tu botón de WhatsApp

<div onclick=”location.href=’https://api.whatsapp.com/send?phone=PHONENUMBERHERE&amp;text=Hi,%2we%20use%20ToChat.Be’;” align=”center” class=”whatsappbutton”><i class=”fa fa-whatsapp fa-2x”></i><span>Contact Us</span></div>

Obviously place your own phone number at “PHONENUMBERHERE”.

La CSS para tu botón y link a WhatsApp

/* WhatsApp Button */

.whatsappbutton { background-color: #7ACC72; /* Green */ border: none; color: white; text-align: center; text-decoration: none; font-size: 16px; border-radius: 20px; padding: 10px 20px; margin-top: 10px !important; width: fit-content; margin: auto; cursor: pointer }

.whatsappbutton span { vertical-align: text-bottom !important; }

.fa-whatsapp { margin-right: 10px; }

Puedes crear una versión corta del link a WhatsApp Short Url WhatsApp Button

Descargar archivo HTML con el botón WhatsApp

Este es un archivo con el código HTML que puede utilizar para crear su página de destino.

Una mejor versión del enlace a WhatsApp

Puede crear una versión mejor del Enlace a WhatsApp utilizando nuestro servicio para crear enlace a WhatsApp .

Con este enlace puede administrar sus estadísticas y agregar su mensaje de bienvenida con nuestro editor fácil de usar. Codificar directamente siempre es riesgoso y su enlace puede dejar de funcionar.

También te damos una URL corta con un formato más agradable. Su URL será como: https://chatwith.io/s/5f687a450cf8a

Puede usar este enlace a WhatsApp en el código que compartimos antes:

<div onclick=”location.href=’https://chatwith.io/s/5f687a450cf8a’;” align=”center” class=”whatsappbutton”><i class=”fa fa-whatsapp fa-2x”></i><span>Contact Us</span></div>