Así es como aparece un botón Click to Chat en un sitio web
Imagina poder escribirle a alguien por WhatsApp sin el paso extra de guardar su número. Bueno, eso es exactamente lo que hace posible Click to Chat. Es como tener una línea directa al buzón de cualquiera, siempre que tengas su número y use WhatsApp. Esta práctica función es conveniente para interacciones rápidas con personas con las que quizá no vuelvas a hablar —piensa en vendedores de un mercado o un contacto de un evento de networking.
Conociendo Click to Chat
¿Y cómo funciona? Si alguna vez dudaste en guardar el número de alguien solo para un chat puntual en WhatsApp, Click to Chat es tu nuevo mejor amigo. Solo necesitas el número de teléfono de la persona y la seguridad de que usa WhatsApp. Luego, con un simple clic en un enlace, ya estás listo para empezar a chatear, sin necesidad de guardar el contacto.
Potenciando Click to Chat con Wassenger
Mientras Click to Chat simplifica los mensajes en WhatsApp, Wassenger amplifica su funcionalidad, ofreciendo a las empresas un control conversacional sin igual. Nuestra plataforma multiagente lleva la simplicidad de Click to Chat y la adapta a las necesidades empresariales. Con Wassenger, puedes gestionar múltiples conversaciones con clientes sin esfuerzo a través de WhatsApp. Es ideal para equipos de soporte al cliente, profesionales de ventas y cualquiera que necesite manejar varias interacciones de WhatsApp de forma eficiente y efectiva.
🚀 Descubre cómo Wassenger puede revolucionar la comunicación de tu negocio y equipo en WhatsApp.
Demostración de chat web de WhatsApp optimizada para equipos de Wassenger
Crea tu acceso directo de chat
Para crear tu propio enlace Click to Chat, comienza con:
https://wa.me/<number>
ingresando el número de teléfono completo en formato internacional sin ceros, paréntesis, guiones ni símbolos.
Por ejemplo, si tu número de teléfono es el siguiente:
+1 (555) 123-4567
Lo escribirás así en la URL:
[https://wa.me/15551234567](https://wa.me/15551234567)
en lugar de
[https://wa.me/+001-(555)123-4567](https://wa.me/+001-%28555%291234567.)
Y con Wassenger, puedes llevar esto al siguiente nivel integrando estos enlaces de chat dentro de una estrategia de comunicación más amplia, permitiendo una interacción y compromiso con el cliente más dinámicos.
🤩 Wassenger es una plataforma completa de WhatsApp para equipos. Regístrate para una prueba gratuita de 7 días y comienza en minutos!
Añade un toque personal con un mensaje predefinido
¿Quieres iniciar la conversación de forma más directa? Puedes predefinir un mensaje que aparezca en el chat. Solo añade
?text=yourmessage
al enlace, reemplazando yourmessage por tus palabras reales (asegúrate de codificarlas en URL para esos espacios y caracteres especiales).
Por ejemplo:
https://wa.me/15551234567?text=Hello%20there! te inicia con un amistoso "Hello there!" ya en el cuadro de chat.
¿Y qué tal un mensaje más largo con varias líneas?
Hi,
I would like to know more about your product.
Please contact me!
El texto anterior se codificará como texto compatible con URL de la siguiente manera:
Hi%2C%0AI%20would%20like%20to%20know%20more%20about%20your%20product.%0APlease%20contact%20me%21
De esta forma puede usarse con seguridad como un enlace click-to-chat en WhatsApp de la siguiente manera:
https://wa.me/15551234567?text=Hi%2C%0AI%20would%20like%20to%20know%20more%20about%20your%20product.%0APlease%20contact%20me%21
Puedes codificar tu mensaje para que sea compatible con URL usando esta herramienta gratuita en línea.
Usa el botón oficial 'Chat on WhatsApp'
Luego está el botón oficial Chat on WhatsApp. Tiene ese factor de reconocimiento instantáneo —un aspecto familiar en verde y blanco en el que los usuarios confían. Si diriges un negocio, colocar este botón en tu sitio web o en tus correos electrónicos puede ser un verdadero generador de conversaciones. Mantén el diseño oficial para coherencia y confianza.
Al combinar Wassenger con el botón ‘Chat on WhatsApp’ en tu sitio web, puedes optimizar la experiencia de atención al cliente, permitiendo que tu equipo gestione múltiples chats y clientes al mismo tiempo directamente desde tu sitio web con eficiencia a través de la plataforma de WhatsApp optimizada para equipos de Wassenger.
🤑 💰 Gana 30% de comisión refiriendo usuarios a Wassenger. Obtén tu enlace de referido ahora. Aplican términos.
Buenas prácticas para el botón de chat
- Mantén el diseño del botón tal cual —no hace falta modificarlo.
- Colócalo donde sea fácil de ver y encaje con tu diseño. Por defecto, se mostrará en la esquina inferior izquierda de la página.
Puedes poner este botón prácticamente en cualquier parte en línea, como en tu página principal, en tu firma de correo o incluso dentro de una app. Es flexible.
Cómo integrar el botón en tu sitio web
¿Quieres que el botón esté en tu sitio? Aquí tienes unos fragmentos simples de HTML para insertarlo. Para un gráfico vectorial escalable, tu código se verá así:
<a
href="https://wa.me/15551234567"
title="Chat with us on WhatsApp"
style="margin: 0 0 20px 0 !important;
height: 52px; min-width: 52px; padding: 10px 0px 0px 10px; position: fixed !important; bottom: 10px; right: 20px; z-index: 999999999 !important; background-color: #00E785;
box-shadow: 4px 5px 10px rgba(0, 0, 0, 0.4); border-radius: 100px"
>
<svg
width="42"
height="42"
viewBox="0 0 28 28"
fill="none"
xmlns="http://www.w3.org/2000/svg"
>
<g clip-path="url(#clip0_1024_354)">
<path
d="M23.8759 4.06939C21.4959 1.68839 18.3316 0.253548 14.9723 0.0320463C11.613 -0.189455 8.28774 0.817483 5.61565 2.86535C2.94357 4.91323 1.10682 7.86244 0.447451 11.1638C-0.21192 14.4652 0.351026 17.8937 2.03146 20.8109L0.0625 28.0004L7.42006 26.0712C9.45505 27.1794 11.7353 27.7601 14.0524 27.7602H14.0583C16.8029 27.7599 19.4859 26.946 21.768 25.4212C24.0502 23.8965 25.829 21.7294 26.8798 19.1939C27.9305 16.6583 28.206 13.8682 27.6713 11.1761C27.1367 8.48406 25.8159 6.01095 23.8759 4.06939ZM14.0583 25.4169H14.0538C11.988 25.417 9.96008 24.8617 8.1825 23.8091L7.7611 23.5593L3.3945 24.704L4.56014 20.448L4.28546 20.0117C2.92594 17.8454 2.32491 15.2886 2.57684 12.7434C2.82877 10.1982 3.91938 7.80894 5.67722 5.95113C7.43506 4.09332 9.76045 2.87235 12.2878 2.48017C14.8152 2.08799 17.4013 2.54684 19.6395 3.78457C21.8776 5.02231 23.641 6.96875 24.6524 9.3179C25.6638 11.6671 25.8659 14.2857 25.2268 16.7622C24.5877 19.2387 23.1438 21.4326 21.122 22.999C19.1001 24.5655 16.6151 25.4156 14.0575 25.4157L14.0583 25.4169Z"
fill="#E0E0E0"
></path>
<path
fill-rule="evenodd"
clip-rule="evenodd"
d="M10.6291 7.98363C10.3723 7.41271 10.1019 7.40123 9.85771 7.39143C9.65779 7.38275 9.42903 7.38331 9.20083 7.38331C9.0271 7.3879 8.8562 7.42837 8.69887 7.5022C8.54154 7.57602 8.40119 7.68159 8.28663 7.81227C7.899 8.17929 7.59209 8.62305 7.38547 9.11526C7.17884 9.60747 7.07704 10.1373 7.08655 10.6711C7.08655 12.3578 8.31519 13.9877 8.48655 14.2164C8.65791 14.4452 10.8581 18.0169 14.3425 19.3908C17.2382 20.5327 17.8276 20.3056 18.4562 20.2485C19.0848 20.1913 20.4843 19.4194 20.7701 18.6189C21.056 17.8183 21.0557 17.1323 20.9701 16.989C20.8844 16.8456 20.6559 16.7605 20.3129 16.5889C19.9699 16.4172 18.2849 15.5879 17.9704 15.4736C17.656 15.3594 17.4275 15.3023 17.199 15.6455C16.9705 15.9888 16.3139 16.7602 16.1137 16.9895C15.9135 17.2189 15.7136 17.2471 15.3709 17.0758C14.3603 16.6729 13.4275 16.0972 12.6143 15.3745C11.8648 14.6818 11.2221 13.8819 10.7072 13.0007C10.5073 12.6579 10.6857 12.472 10.8579 12.3007C11.0119 12.1472 11.2006 11.9005 11.3722 11.7003C11.5129 11.5271 11.6282 11.3346 11.7147 11.1289C11.7603 11.0343 11.7817 10.9299 11.7768 10.825C11.7719 10.7201 11.7409 10.6182 11.6867 10.5283C11.6001 10.3566 10.9337 8.66151 10.6291 7.98363Z"
fill="white"
></path>
<path
d="M23.7628 4.02445C21.4107 1.66917 18.2825 0.249336 14.9611 0.0294866C11.6397 -0.190363 8.35161 0.804769 5.70953 2.82947C3.06745 4.85417 1.25154 7.77034 0.600156 11.0346C-0.051233 14.299 0.506321 17.6888 2.16894 20.5724L0.222656 27.6808L7.49566 25.7737C9.50727 26.8692 11.7613 27.4432 14.0519 27.4434H14.0577C16.7711 27.4436 19.4235 26.6392 21.6798 25.1321C23.936 23.6249 25.6947 21.4825 26.7335 18.9759C27.7722 16.4693 28.0444 13.711 27.5157 11.0497C26.9869 8.38835 25.6809 5.94358 23.7628 4.02445ZM14.0577 25.1269H14.0547C12.0125 25.1271 10.0078 24.5782 8.25054 23.5377L7.8339 23.2907L3.51686 24.4222L4.66906 20.2143L4.39774 19.7831C3.05387 17.6415 2.4598 15.1141 2.70892 12.598C2.95804 10.082 4.03622 7.72013 5.77398 5.88366C7.51173 4.04719 9.81051 2.84028 12.3089 2.45266C14.8074 2.06505 17.3638 2.5187 19.5763 3.74232C21.7888 4.96593 23.5319 6.89011 24.5317 9.21238C25.5314 11.5346 25.7311 14.1233 25.0993 16.5714C24.4675 19.0195 23.0401 21.1883 21.0414 22.7367C19.0427 24.2851 16.5861 25.1254 14.0577 25.1255V25.1269Z"
fill="white"
></path>
</g>
<defs>
<clipPath id="clip0_1024_354">
<rect
width="27.8748"
height="28"
fill="white"
transform="translate(0.0625)"
></rect>
</clipPath>
</defs>
</svg>
</a>;
Importante: recuerda cambiar wa.me/15551234567 por tu número real de WhatsApp con el prefijo del país como se explicó antes.
Luego pega el código en tu HTML justo después de la etiqueta
¡y ya lo tendrás!¡Felicidades y bienvenido a una mejor conversación con clientes basada en WhatsApp para tu negocio 🥳!
Unas palabras finales
Click to Chat y el botón Chat on WhatsApp eliminan los pequeños obstáculos en la comunicación digital. Son perfectos para empresas que buscan una experiencia fluida para el cliente o para cualquiera que valore la comunicación eficiente. Solo una advertencia: por ahora el botón solo está disponible en inglés.
Al añadir Wassenger a la mezcla, no solo abres una línea de comunicación; estás proporcionando una plataforma integral para gestionar esas interacciones que puede crecer con tu negocio. Pruébalo gratis y observa cómo tus conversaciones en línea pueden volverse aún más accesibles y productivas.
Así que adelante, pruébalo. Se trata de hacer tus interacciones digitales tan amables y sin esfuerzo como una buena charla de café. Ya sea para contactar clientes o saludar a un nuevo amigo, estas herramientas están aquí para hacer tu vida en línea un poco más fácil.
🤩 Wassenger es una solución completa de API basada en WhatsApp. Pruébalo gratis por 7 días — ¡no se requiere tarjeta!
