Configurar el widget de chat de WhatsApp

Opción 1: Widget con ventana emergente

Esta versión muestra un pequeño CTA en una ventana emergente antes de redirigir al visitante a WhatsApp. Es una excelente opción para interactuar con los usuarios sin ser invasiva.

¿Dónde agregarlo?

Pega el siguiente script al final de tu sitio web o página de destino (antes de la etiqueta de cierre </body> ).

Necesitarás el ID corto del equipo, que puedes encontrar en la página Configuración del equipo al hacer clic en tu nombre de usuario, en la esquina superior derecha de la aplicación web.

Opciones de personalización:

• phoneNumber 📞 – El número de WhatsApp de tu empresa
• welcomeText 👋 – Texto que se muestra en la ventana emergente
• customerMessage 💬 – Mensaje predefinido en el cuadro de chat de WhatsApp
• ctaText 🔘 – Texto del botón de la ventana emergente
• brandName 🏷️ – Nombre de marca opcional
• brandIconUrl 🖼️ – URL opcional del ícono de marca
• primaryColor 🎨 – Color del ícono de WhatsApp

<script>  window.ChakraChatWidgetSettings = {	teamId: 'your-team-short-id',    widgetType: 'whatsapp',    chatLauncherConfig: {      // primaryColor: '#13c2c2',    },    whatsappWidget: {      phoneNumber: '+91**01258455',      theme: 'classic',      classic: {        welcomeText: 'Do you have more questions?',        // brandName: 'ChakraHQ', // optional        // brandIconUrl: 'https://s3.ap-south-1.amazonaws.com/static-data.chakrahq.com/assets/images/chakra-icon-with-bg/icon-48x48.png', // optional        customerMessage: 'Tell me more',        ctaText: 'Chat Now'      }    }  };</script><script type="text/javascript" async defer src="https://embed.chakrahq.com/chat/v1/widget.js"></script>

Opción 2: Widget sin ventana emergente

Esta versión crea un botón flotante de WhatsApp que abre directamente un chat de WhatsApp: es ideal para una interfaz minimalista.

¿Dónde agregarlo?

Coloca el script en la parte inferior de la página, justo antes de la etiqueta de cierre </body> .

Opciones de personalización

• phoneNumber 📞 – El número de WhatsApp de tu empresa
• customerMessage 💬 – Mensaje predefinido de WhatsApp
• primaryColor 🎨 – Color del ícono de WhatsApp

<script>  window.ChakraChatWidgetSettings = {	teamId: 'your-team-short-id',    widgetType: 'whatsapp',    chatLauncherConfig: {      // primaryColor: '#13c2c2',    },    whatsappWidget: {      phoneNumber: '9901258433',      theme: 'buttonOnly',      buttonOnly: {        customerMessage: 'Tell me more'      },    }  };</script><script type="text/javascript" async defer src="https://embed.chakrahq.com/chat/v1/widget.js"></script>