Configuración de TravelBot LiveChat

Configura tu LiveChat en Minutos

Configura el widget de TravelBot LiveChat con facilidad. Personaliza su apariencia, comportamiento e integraciones para mejorar la interacción con los clientes.

Comenzar

Código de Integración

Copia y pega el siguiente código en el <body> de tu sitio web para activar el widget de TravelBot LiveChat. 


<script id="live-chat-mychatbot" src="https://widget.mychatbot.es/assets/js/widget.js" type="module"></script>
  document.addEventListener("DOMContentLoaded", () => {
    LiveChat.init({
      agent_id: "agent-id",
      position: "right",
    });
  });
</script>

Configuración Avanzada

Configura parámetros avanzados para adaptar el widget a tu sitio web.

Control de Z-Index

El parámetro zindex controla el orden de capas del widget. Úsalo si el widget aparece detrás de otros elementos en tu página.

Default: 99999999 


<script id="live-chat-mychatbot" src="https://widget.mychatbot.es/assets/js/widget.js" type="module"></script>
  document.addEventListener("DOMContentLoaded", () => {
    LiveChat.init({
      agent_id: "agent-id",
      position: "right",
      zindex: 5000,  // Controla el orden de capas (botón, overlay, ventana)
    });
  });
</script>

💡 Consejo: Si el widget aparece detrás de otros elementos, intenta aumentar el valor de zindex. Valores típicos: 5000 (bajo), 50000 (medio), 999999 (muy alto).

Ejemplo Completo

Aquí se muestra la integración con las opciones más comunes: 


<script id="live-chat-mychatbot" src="https://widget.mychatbot.es/assets/js/widget.js" type="module"></script>
  document.addEventListener("DOMContentLoaded", () => {
    LiveChat.init({
      agent_id: "your-agent-id",
      position: "right",
      title: "¿Cómo te podemos ayudar?",
      button_color: "#e11d48",
      button_text_color: "#ffffff",
      avatar_url: "https://your-site.com/avatar.png",
      initial_message: "¡Hola! ¿En qué puedo ayudarte?",
      submit_text: "Enviar",
      zindex: 5000,  // Orden de capas
    });
  });
</script>
1

Personalizar Apariencia

Elige colores, fuentes y la posición del widget para que coincida con tu marca. Previsualiza los cambios en tiempo real para un ajuste perfecto con tu sitio web.

2

Establecer Reglas de Comportamiento

Define activadores, como el tiempo en la página o las acciones del usuario, para mostrar el widget de chat. Personaliza saludos y respuestas automáticas para una mayor interacción.

3

Integrar y Publicar

Conecta TravelBot con tu CRM, correo electrónico u otras herramientas. Copia el fragmento de código generado y pégalo en tu sitio web para activarlo.