Botón de chat de Whatsapp

Botón de chat de Whatsapp

Si deseas implementar un botón flotante de chat de Whatsapp en tu tienda en línea de Sellibrí, de tal forma que puedas enlazar este con tu teléfono de atención al cliente y que los visitante de tu tienda puedan contar con este canal para cualquier consulta que requieran hacerte, sigue los pasos a continuación para implementarlo:

  1. Ingresa al panel de gestión de tu tienda en línea.
  2. Ingresa al módulo Tienda>Diseño.
  3. Dentro de este, identifica la sección llamada "CSS y JavaScript personalizado".
  4. En los campos que se encuentran dentro de esta sección, aplica los códigos que se especifican a continuación y al finalizar, oprime el botón "Guardar".

Implementa los estilos que definen la apariencia y posición del botón flotante (realiza los ajustes que veas más convenientes para la visualización de este botón en tu tienda). Pega el código que se muestra a continuación en el campo de tu tienda llamado Código CSS.

<style>
.float-wa{
        position:fixed;
        width:60px;
        height:60px;
        bottom:40px;
        right:40px;
        background-color:#25d366;
        color:#FFF;
        border-radius:50px;
        text-align:center;
        font-size:30px;
        z-index:100;
}
</style>


A su vez, debes aplicarle el icono de Whatsapp al botón que vas a implementar. Para ello, vamos a usar la librería de FontAwesome. Pega el código que se muestra a continuación en el campo de tu tienda llamado Código JavaScript (<head>).



Por ultimo, debes insertar el enlace que abrirá WhatsApp. Del enlace https://wa.me/TELEFONO?text=MENSAJE, debes reemplazar la palabra TELÉFONO con tu número de teléfono en formato internacional (sin signos, guiones o paréntesis). Por ejemplo, si tu número es +58 414 123 4567, debes escribirlo de la siguiente forma: 584141234567. En la palabra MENSAJE, debes reemplazar esta por el mensaje que quieras que se inserte en el campo de texto de la conversación al momento que tu cliente sea dirigido a Whatsapp. Pega el código que se muestra a continuación en el campo de tu tienda llamado Código JavaScript (inicio de <body>).

<a href="https://wa.me/584141234567?text=Hola, me interesa un producto de la tienda en línea!" class="float-wa" target="_blank">
    <i class="fa fa-whatsapp" style="margin-top:16px;"></i>
</a>


Si realizaste los pasos anteriores de forma correcta, al ingresar al frente de tu tienda, vas a visualizar el botón flotante de chat de Whatsapp. Realiza las pruebas necesarias para asegurarte que esté funcionando de forma correcta y que esté enlazado con el número de teléfono correspondiente.

    • Related Articles

    • Combo de productos

      Si estás buscando una forma efectiva de aumentar tus ventas, mejorar la experiencia del cliente y optimizar tu inventario, crear combos de productos puede ser la solución perfecta. Con la aplicación de Combo de productos, puedes agrupar productos de ...

    • Mensaje de dedicatoria

      En el mundo del comercio electrónico, personalizar la experiencia de compra de tus clientes es una excelente manera de destacar frente a la competencia y fidelizar a tu audiencia. Una de las formas más populares de hacerlo es permitiendo que los ...

    • Pedido programado

      En el competitivo mundo del comercio electrónico, ofrecer flexibilidad y conveniencia a tus clientes puede marcar la diferencia entre una venta perdida y un cliente fiel. Una de las formas más innovadoras de mejorar la experiencia de compra es ...