El botón de WhatsApp es el canal preferido por los clientes para despejar dudas y avanzar en sus compras. En Tiendanube, podés habilitar esta funcionalidad desde distintas secciones de tu administrador, dependiendo de si buscás una configuración nativa rápida o funciones avanzadas mediante aplicaciones externas.
El botón va a ser visible para tus clientes desde un celular, llevando a la aplicación de WhatsApp, o desde una computadora, abriendo WhatsApp Web.
Vendé y atendé por WhatsApp con Tiendanube
A continuación, te explicamos cómo configurar el botón de WhatsApp según la sección del administrador desde la que quieras hacerlo.
Pasos para configurar el botón de Whatsapp en mi tienda
Desde WhatsApp
Ingresar, desde el administrador, a la sección "WhatsApp" del menú lateral.
Con números ya conectados
Elegir una de estas dos alternativas:
-
Usar el número actual: Activar el interruptor (toggle) "Botón de WhatsApp" sobre el número ya vinculado.
- Usar un nuevo número: Hacer clic en "Agregar nuevo número", verificar el número con META completando los datos solicitados y una vez incorporado en el administrador activar el interruptor.
Sin números conectados
1. Hacer clic en "Agregar botón".
2. Ingresar el código de área del país (ej: +54 para Argentina) e informar el número completo. Luego hacer clic en "Guardar".
3. Verificar que el número haya quedado configurado y figure en color verde en la parte superior.
4. Activar el botón mediante el activador que aparece junto al número.
Si, en algún momento, querés modificar el número de teléfono vinculado, podrás hacerlo desde esa misma sección "WhatsApp" haciendo clic en "Modificar número". También podrás desactivar el botón de WhatsApp desde ahí haciendo clic en el activador.
Desde Configuración
1. Ir a la sección "Configuración > Botón de WhatsApp" del administrador de tu tienda.
2. Hacer clic en "Informar teléfono".
3. Agregar el número de WhatsApp al que querés que te contacten.
Warning
El código telefónico del país con el que registraste tu Tiendanube viene configurado por defecto y no es posible modificarlo.
Por eso, si querés configurar un teléfono con una característica diferente a la que ves en el campo, deberás usar la sección "Más opciones con Aplicaciones" de este artículo.
4. Comprobar que la casilla "Mostrar un botón en tu tienda para que puedan escribirte por WhatsApp" se encuentre tildada. Luego, hacer clic en "Agregar".
Si, en algún momento, querés modificar el número de teléfono vinculado, podrás hacerlo desde esa misma sección "Configuración > Botón de WhatsApp". También podrás desactivar el botón de WhatsApp desde ahí destildando la casilla y guardando los cambios.
Helpjuice Success Callout Title
Si tu tienda tiene el FTP abierto (diseño a medida) y el botón de WhatsApp no se visualiza correctamente después de activarlo, te sugerimos contactar a tu diseñador o desarrollador. Es necesario que verifique si el código de tu diseño personalizado tiene integrada la documentación técnica necesaria para esta funcionalidad.
Podrás compartirle este enlace con las instrucciones técnicas: Documentación para botón de WhatsApp.
¡Listo!
Al completar los pasos de configuración según la opción que elijas, tendrás configurado el botón de WhatsApp en tu tienda, desde el que tus clientes podrán contactarte fácilmente.
Más opciones con Aplicaciones
En Tiendanube Aplicaciones, encontrás diversas aplicaciones que te permiten configurar el botón de WhatsApp (y otros canales) en tu tienda. Algunas de ellas incluyen configuraciones adicionales, como programar horarios en los que el botón se muestra, modificar su aspecto, vincular más de un número de teléfono o conectar también otros canales de atención.
Aplicaciones para sumar el botón
Usar una de las aplicaciones que tienen la funcionalidad para agregar el botón de WhatsApp, es una buena alternativa si:
- Querés vincular un número con un código telefónico diferente al que se muestra por defecto en tu Administrador.
- Necesitás conectar más de un número de teléfono.
- Querés personalizar características adicionales del botón, como su aspecto, cuándo está disponible o en qué páginas de tu tienda se muestra.
Podrás ver los tutoriales sobre cómo instalar cada aplicación en la sección Aplicaciones de Comunicación. Algunas de estas son: TITANPush, WhatsPRO (que te permite configurar más de un teléfono), Chaty, Cliengo.
A continuación, a modo de ejemplo, te mostramos cómo activar el botón de WhatsApp con TITANPush:
1. Instalar la aplicación de TITANPush siguiendo el tutorial:
¿Cómo integrar TITANPush con mi tienda?
2. Una vez que la aplicación esté instalada en tu tienda, podrás activar el botón de WhatsApp ingresando a la sección de "Chat Pop" en el panel de administración de TITANPush. Ahí, hacer clic en "Configurar".
3. Elegir la opción de WhatsApp, seleccionar el país y completar el número de teléfono que querés vincular.
4. Configurar las opciones de personalización del botón: su posición, si contiene texto y cuál, día y horario de disponibilidad y las páginas de tu tienda en las que se mostrará.
Luego, hacer clic en "Guardar".
Info
Del lado derecho de la pantalla, podrás ver una previsualización de cómo quedará el botón.
5. Después, verás este mensaje de confirmación, que indica que los cambios se guardaron y que puede tardar hasta 10 minutos en reflejarse en tu tienda.
Personalizar el botón de WhatsApp con CSS (tamaño y posición)
Helpjuice Warning Callout Title
Estos ejemplos aplican al botón de WhatsApp nativo de Tiendanube. Si tu tienda tiene diseño a medida (FTP), tu desarrollador puede haber cambiado la estructura y necesitarás adaptar los códigos con su ayuda.
Códigos CSS para cambiar el tamaño del botón flotante
El siguiente código permite modificar el tamaño y la posición del botón de WhatsApp que aparece flotando en tu tienda. Cada línea controla una característica distinta.
Los valores están expresados en px (píxeles). Cuanto mayor es el número, más grande o más lejos del borde quedará el elemento. Podrás modificarlos libremente hasta encontrar el resultado que buscás.
/* Cambiar tamaño del botón flotante */
.btn-whatsapp {
width: 70px; /* Ancho del botón. Aumentá o bajá el número para hacerlo más ancho o angosto. */
height: 70px; /* Alto del botón. Se recomienda usar el mismo valor que width para mantenerlo redondo. */
font-size: 32px; /* Tamaño del ícono de WhatsApp dentro del botón. */
}
/* Ajustar posición */
.btn-whatsapp {
bottom: 30px; /* Distancia desde el borde inferior de la pantalla. */
right: 20px; /* Distancia desde el borde derecho de la pantalla. */
}¿Cómo aplicar estos códigos en tu tienda?
Si nunca editaste el CSS de tu tienda antes, seguí las instrucciones del siguiente tutorial para saber exactamente dónde pegar el código:
¿Qué hacer si hay conflicto con otros estilos del diseño?
A veces el diseño de tu tienda puede tener estilos propios que "pisan" los cambios que agregás. En ese caso, añadí !important al final del valor para forzar que ese estilo tenga prioridad:
.btn-whatsapp {
width: 70px!important; /* El !important obliga a que este valor se aplique por encima de otros estilos. */
height: 70px!important;
}¿Cómo mover el botón de WhatsApp a la izquierda?
Para cambiar la posición del botón flotante de WhatsApp, que por defecto se ubica a la derecha, hacia la izquierda, seguí los pasos que indicamos en:
¿Cómo alinear el ícono de WhatsApp a la izquierda en mi tienda?
También podés consultar cómo cambiar el prefijo telefónico para el botón de WhatsApp.