OkeyBot
🦸‍♂️ Soporte dedicado🚀 Crear cuenta🟢 API de WhatsApp
  • 👋Bienvenido a OkeyBot
  • 📖Glosario de Términos
  • 🚀Comenzando
    • ⚡Inicio Rápido
    • 🔌Conectando un Canal
    • 👥Invita a tus Colegas
    • ✏️ Responder a los Mensajes
    • 🤖Creando un Chatbot
  • 🎛️ Módulos de navegación
    • 💻Escritorio
    • 💬Mensajes
      • Asignación y Cierre de Conversación
      • Interacción con IA
      • Asistente de IA
    • 👤Contactos
      • Detalles de contacto
      • Sugerencias de Fusión de Contactos
      • Actividad de contacto
      • Canales del contacto
      • Importar Contactos
      • Exportar contactos
      • Segmentos
    • 📣Difusiones
      • Gestión de difusiones
      • Enviar difusión
      • Difusiones y flujos de trabajo
      • Solución de conflictos
    • 📑Flujos de Trabajo
      • Disparadores
      • Pasos
    • 📊Reportes
      • Conversaciones
      • Respuestas
      • Resoluciones
      • Mensajes
      • Contactos
      • Asignaciones
      • Tabla de clasificación
      • Usuarios
      • Difusiones
  • ⚙️Ajustes
    • 🛠️Administrar Espacio de Trabajo
    • ☸️Configuración General
    • 👥Usuarios
      • Niveles de acceso
    • 🫂Equipos
    • 🔛Canales
      • Menú persistente
    • 🆙Widgets de Crecimiento
    • 🔢Campos Personalizados
    • ⛓️Integraciones
    • 📝Notas de Cierre
    • 🏃Atajos
    • 🗂️Archivos
    • 📉Exportación de Datos
    • 🧠IA
  • 👥Cuenta de usuario
    • 👤Perfil del Usuario
    • ✅Actividad del Usuario
    • 🔔Notificaciones
    • 🔁Restablecer su Contraseña
  • 📞Contactos y mensajes
    • 🎯Variables Dinámicas
    • 👁️Búsqueda de Contactos y Bandeja de Entrada Personalizada
    • 🗨️Conversaciones
  • 🌐Canales de mensajería
    • 🗃️Resumen de Canales
    • 📌Facebook Messenger
      • Chat online de Facebook
      • Respuestas privadas
      • Mensaje de etiqueta
    • 📌 Instagram
    • 📌 WhatsApp
      • WhatsApp Cloud API META
      • WhatsApp Business API
        • Configuración WhatsApp Business API
      • 360Dialog WhatsApp
      • Twilio WhatsApp
      • MensajeBird WhatsApp
      • WhatsApp de Vonage
      • Plantillas de mensajes de WhatsApp
    • 📌 Widget de Chat Online
      • Instalar en WordPress
      • Instalar en Shopify
      • Instalar en Wix
      • Instalar en Joomla
      • Instalar en Squarespace
    • 📌Mensajes de Google Business
    • 📌LINE
    • 📌 Telegram
    • 📌 Viber
    • 📌 SMS
      • Twilio SMS
      • MessageBird SMS
      • Vonage SMS
    • 📌Twitter
    • 📌 WeChat
    • 📌 Email
      • Gmail
      • Otros proveedores
    • 📌Canal Personalizado
  • 🔌Integraciones
    • 🆗Dialogflow
      • Conectando a Dialogflow
      • Gestión de intenciones
        • Parámetros
          • Etiquetado
          • Apagando el Bot
          • Cerrar una conversación
          • Asignar
          • Envío de notificaciones personalizadas
          • Darse de baja
          • Campos de contacto y valores
          • Envío de atajos
          • Envío de archivos
          • Solicitando ubicación
        • Eventos
        • Plantillas de respuesta
        • Cargas útiles personalizadas
        • Request de webhook (Fulfillment)
    • 🆕Zapier
    • 👨‍💻API de Desarrollador
    • 🕸️Webhooks
  • ☁️Api de desarrolladores
    • 📥API de Contactos
    • 💭API de Mensajes
      • API Mensajes de plantillas
  • 🤝Programas de asociación
    • 💡Visión General
    • 💲Programa de Afiliación
    • ®️Programa de Socios
      • Apariencia de la plataforma
      • Nombre de dominio personalizado
      • API de revendedor
  • 📣Enlaces de interés
  • 🦸‍♂️ Soporte Ejecutivo
  • 🚨Actualizaciones
    • Octubre 2023 [v11.0] Nuevo disparador, paso de flujo de trabajo y más
    • Octubre 2023 [v10.9] Nuevo disparador de flujos de trabajo: Anuncios de clic-to-chat
    • Octubre 2023 [v10.8] Nueva experiencia de conexión de canales
    • Septiembre 2023 [v10.7] Saluda al nuevo Asistente de IA
    • Septiembre 2023 [v10.6] Mejoras en el flujo de trabajo y más
    • Agosto 2023 [10.5] Mejoras en el comportamiento del canal y configuración de Messenger
    • Agosto 2023 [v10.4] ¡IA de Okeybot ya está aquí!
    • Agosto 2023 [v10.3] Capacidades de búsqueda mejoradas en el módulo de mensajes
    • Julio 2023 [v10.2] Experiencia al usuario mejorada: nuevas funciones
    • Julio 2023 [v10.1] Nueva integración de Make.com
    • Julio 2023 [v10.0] Nuevas incorporaciones a las plantillas de mensajes de WhatsApp
    • Julio 2023 [v9.9] Experiencia de correo electrónico nueva y mejorada
    • Junio 2023 [v9.8] Experiencia de navegación de plantillas de flujo de trabajo mejorada
    • Junio 2023 [v9.7] Mejoras en los flujos de trabajo y experiencia de usuarios
    • Junio 2023 [v9.6] Nuevas actualizaciones para mejorar la experiencia
    • Mayo 2023 [v9.5] Análisis de reportes y difusiones renovados
    • Abril 2023 [v9.4] Números de teléfonos y correos estandarizados
    • Abril 2023 [v9.3] Okeybot es un proveedor oficial de WhatsApp
    • Marzo 2023 [v9.2] Pegatinas recibidas
    • Marzo 2023 [v9.1] Nuevo Módulo de Difusiones
    • Febrero 2023 [v9.0] Nuevas plantillas de Flujos de Trabajo y mejoras en las de WhatsApp
    • Enero 2023 [v8.9] Actualizado con los nuevos eventos webhooks
    • Enero 2023 [v8.8] ¡Mensajes de Google Business está aquí!
    • Diciembre 2022 [v8.7] Activar flujos de trabajo con webhooks entrantes
    • Diciembre 2022 [v8.6] ¡Protección mejorada contra virus!
    • Diciembre 2022 [v8.5] Nuevos Widgets para su Sitio Web y Nuevos Idiomas Disponibles.
    • Noviembre 2022 [v8.4] Nuevo Diseño en Detalles del Contacto e Idioma Árabe Disponible
    • Octubre 2022 [v8.3.6] Mejoras en Mensajería y Canales, Idioma Portugués Disponible, entre otros.
    • Octubre 2022 [v8.3.5] Actualización de la API de Contactos y Mensajería
    • Septiembre 2022 [v8.3.4]Construya la automatización de forma más intuitiva con estas mejoras.
    • Septiembre 2022 [v8.3.3] WhatsApp Cloud API
    • Agosto 2022 [v8.3.2] Importar contactos 2.0 y Idioma Español Disponible
    • Agosto 2022 [v8.3.1] No más conversaciones sin asignar cuando se cierran
    • Marzo 2022 [v8.3] Nuevos Accesos Directos, Variables y Condiciones de Flujo de Trabajo
    • Febrero 2022 [v8.2] Módulo de Mensajes Rediseñado, Nueva Integración de Canales Personalizados y más
    • Diciembre 2021 [v8.1] Nuevo Diseño de Navegación y Nuevos Pasos de Flujos de Trabajo
    • Noviembre 2021 [v8.0] Flujos de Trabajo (Automatización 2.0), y API de Mensajes de Plantilla
    • Agosto 2021 [v7.9] Plan Empresas, Mejoras en Mensajes de Plantillas de WhatsApp.
    • Agosto 2021 [v7.8] IMAP/SMTP, Mejoras Chat Web, Mensajes interactivos WhatsApp y más.
    • Julio 2021 [v7.7] ¡Instagram, mejoras en 360Dialog y más!
    • Junio 2021 [v7.6] Informes 2.0, Nota de cierre y más mejoras
    • Mayo 2021 [v7.5] Informes, Dashboard 2.0, Exportación de datos, Mensajes de voz, Zona horaria y más!
    • Febrero 2021 [v7.4] Combinación de contactos
Con tecnología de GitBook
En esta página
  • Conexión del widget de chat web
  • Instalación del widget de chat
  • Personalizar el widget de chat
  • Pantalla y Apariencia del widget
  • Posición
  • Elementos de encabezado
  • Iconos de canales
  • Formulario previo al chat
  • Ajustes adicionales
  • Configuración de canal
  • Identificar usuarios registrados (WIP)
  • Control Programático (API para usuarios)
  • Acciones
  • Oyentes de eventos
  • Métodos de comprobación de estados
  • Solucionar problemas
  • Los mensajes no se pudieron enviar el contacto
  • Widget que no aparece en el sitio web

¿Te fue útil?

  1. Canales de mensajería

Widget de Chat Online

Agregue el widget de chat web okeybot a su sitio.

AnteriorPlantillas de mensajes de WhatsAppSiguienteInstalar en WordPress

Última actualización hace 3 años

¿Te fue útil?

El widget de chat web permite que los visitantes del sitio web se comuniquen con usted a través del chat en vivo a través de otros que haya conectado.

Conexión del widget de chat web

Paso 1: Navegue a la configuración del canal Desde el módulo de configuración , navegue hasta la opción del menú, Canales.

Paso 2: Agregar canal Presione Agregar canal y elija Web Chat. Se abrirá el cuadro de diálogo Widget de conexión de chat web.

Paso 3: Especifique el sitio web Complete los sitios web donde se agregará el widget.

  • Si el usuario agrega https://app.okeybot.com entonces solo https://app.okeybot.com estará en la lista blanca. Cualquier otro subdominio o raíz no debería funcionar.

  • Si el usuario añade https://*.okeybot.com , entonces todos los subdominios, incluyendo el dominio raíz, estarán en la lista blanca.

  • Si el usuario añade https://okeybot.com , entonces sólo el dominio raíz estará en la lista blanca.

Paso 4: Seleccione un color de tema Con el selector de color interactivo, seleccione un color de tema para el widget de chat.

Consejos: ¡Elija un color que coincida con el color de su marca y su sitio web!

Paso 5: Seleccione un ícono de pantalla para el widget Elija un ícono que le gustaría mostrar en el sitio web para el widget.

El widget se puede personalizar aún más una vez conectado.

Paso 6: Siga los pasos en la plataforma Una vez que haya especificado lo necesario, presione SIGUIENTE para continuar.

Paso 7. Instale el script Puede agregar el script generado a su sitio web preferido. Alternativamente, puede enviar las instrucciones de instalación a otra persona por correo electrónico.

Instalación del widget de chat

Es posible que necesite un webmaster o un administrador técnico para que lo ayude a instalar el widget de chat en el sitio web. ¡Busque ayuda si es necesario!

Dependiendo del sistema que utilice para crear y administrar su sitio web, hemos creado guías paso a paso para guiarlo a través de la instalación de un Chat Widget en su sitio web.

Para otras plataformas o servicios, navegue hasta la fuente HTML de la página. Pegue el script antes de la etiqueta.</body>

<body>
...
...
...
<! - PEGUE EL SCRIPT AQUÍ ->
</body>

Si necesita ayuda, puede optar por reenviar el script junto con las instrucciones de instalación al administrador de su sitio web. Seleccione la casilla de verificación correspondiente e ingrese la dirección de correo electrónico de alguien que pueda ayudarlo a instalar el complemento de chat.

El widget de chat web okeybot.com aparecerá en su sitio una vez que la secuencia de comandos se haya instalado correctamente.

Personalizar el widget de chat

Paso 1: Navegue a la configuración del canal Desde el módulo de configuración , navegue hasta la opción del menú, Canales

Paso 2: Ubique el canal de Web Chat Una vez que haya localizado el canal de Web Chat , presione PERSONALIZAR

3. Presione el botón Personalizar para el chat web.

Puede utilizar los campos que aparecen a continuación para personalizar el widget del sitio web para que coincida con la apariencia del sitio web, de modo que el widget tenga un aspecto impecable.

En la parte derecha de la página, hay una vista previa del widget de chat del sitio web. Cualquier personalización realizada en el widget se reflejará en el mismo. Esto ayuda a los usuarios a tener una mejor idea de lo que están personalizando.

Pantalla y Apariencia del widget

Puede personalizar lo siguiente para cambiar la apariencia del widget en el sitio web.

Campo

Descripción

Color del tema

El color elegido se utilizará como color principal de su widget

Color de texto

El color elegido se utilizará como color de texto principal de su widget

Icono de chat web

El icono de pantalla se muestra en el sitio web para que el usuario interactúe con el chat web.

Mensaje Pop Up

El mensaje emergente se muestra a los visitantes del sitio web una vez al día 5 segundos después de la carga de la página. Si no se define, no aparecerá ningún mensaje emergente a los visitantes del sitio web.

Validación para el icono del chat del sitio web :-

  • Tamaño máximo del archivo: 1MB

  • Dimensión máxima del archivo: 256 x 256 px

  • Forma: Cuadrado

Posición

Campo

Descripción

Alinear hacia

El usuario puede especificar una posición para mostrar el widget a la izquierda o a la derecha de la plataforma.

Espaciado vertical

El usuario puede especificar la cantidad de espacio vertical entre el widget de chat del sitio web y la parte inferior de la pantalla.

Espaciado horizontal

El usuario puede especificar la cantidad de espacio horizontal entre el widget de chat del sitio web y el lateral de la pantalla.

Tamaño del widget

El usuario puede elegir el tamaño del widget entre pequeño, estándar o grande.

Opciones de pantalla

El usuario puede elegir mostrar este widget en el escritorio, en los dispositivos móviles o en ambos.

Elementos de encabezado

Campo

Descripción

Título

El título se mostrará en la parte superior de su widget de chat.

Lema

El eslogan se mostrara bajo el título.

Logotipo de chat del sitio

Suelte aquí la imagen de su logotipo para que aparezca en la parte superior del chat del sitio web. El formato puede ser en PNG, SVG o JPG y el tamaño del archivo no es superior a 1,0 MB.

Icono de canales

Esta opción permitirá a los contactos ponerse en contacto con usted a través de su canal preferido, siempre que se den las opciones. Puedes añadir hasta seis canales y se mostrará en la parte superior del Widget de Chat del sitio web.

Validación del logotipo del chat del sitio web:-

  • Tamaño máximo del archivo: 4MB

  • Dimensión máxima del archivo: 1024 x 1024 px

  • Forma: Cuadrado

Iconos de canales

Si el Widget de chat del sitio web no se ha configurado nunca, los canales conectados con la información adecuada aparecerán por defecto como enlaces de canales del Widget.

Enlaces de canal

Campo de entrada obligatorio

WhatsApp

Número de teléfono de WhatsApp

Facebook Messenger

ID de página de Facebook

Telegram

Nombre del bot de Telegram

Twitter

ID de Twitter

LÍNE

ID LINE

Viber

Nombre de la cuenta pública de Viber

SMS

Número de teléfono SMS

Email

Dirección de correo electrónico

Llamada telefónica

Número de teléfono

Enlace personalizado

Dirección URL e icono

QR personalizado

Imagen QR e icono

Validación del logotipo del chat del sitio web:-

  • Tamaño máximo del archivo: 1MB

  • Dimensión máxima del archivo: 256 x 256 px

  • Forma: Cuadrado

Formulario previo al chat

Al activar esta opción, se añadirá un formulario previo al chat de su sitio web. Si está activada, los visitantes de su sitio web recibirán un formulario que deberán rellenar antes de iniciar el chat.

Con esta opción activada, puede incluir campos personalizados adicionales cuando sea necesario. Además de eso, también puede personalizar la etiqueta de los campos por defecto sobre cómo aparecen a sus contactos.

Las etiquetas de los campos se pueden personalizar en un idioma diferente para que coincidan con el idioma del sitio web.

Ajustes adicionales

Campo

Descripción

Texto de la barra de entrada

Este texto funcionará como marcador de posición en el área de escritura.

Tipografía del texto

La fuente que se utilizará para mostrar el tipo de letra en el widget de chat del sitio web.

Restringir archivos adjuntos entrantes

Cuando esta opción está marcada, el visitante del sitio web no tiene la opción de adjuntar un archivo adjunto en el widget del chat del sitio web.

Mantener oculto el chat del sitio web

Al utilizar esta opción el widget estará completamente oculto. Hasta que se haya hecho clic en la Referencia de anclaje.

#webchat_widget

Usando el ancla anterior, puede crear un botón en su página para abrir el widget una vez que haga clic.

Configuración de canal

El canal de chat web se puede configurar con un único: - Nombre del Canal - Dominio (s) del sitio web

Paso 1: Navegar a la configuración de los canales Desde el módulo de configuración, navegar a la opción de menú, Canales .

Paso 2: Localizar el canal de Web Chat Una vez que haya localizado el canal de Web Chat, presione Configurar.

Paso 3: Realice la configuración necesaria

Puede configurar lo siguiente:

  • Nombre del canal: nombre utilizado internamente para identificar la cuenta.

  • Dominios del sitio web: el sitio web del cual se instalará el widget

Importante: Si no agrega su sitio web a esta lista, su widget no se cargará. Puede ingresar varias URL si planea instalar el complemento en varios sitios web.

Paso 4: Actualice la configuración Presione Listo para actualizar la configuración del canal

Identificar usuarios registrados (WIP)

Esta función se lanzará en la próxima versión.

Los usuarios conectados a su sitio web pueden ser identificados añadiendo un simple código JavaScript en el código de su sitio web. Una vez que el identificador pasado coincida con un contacto existente, se reanudará la conversación anterior.

Guía de uso del código:

  • Edite el código para enviar a okeybot el identificador del usuario conectado actualmente, puede ser la dirección de correo electrónico o user_id o cualquier otro campo de contacto.

  • También puede enviar a okeybot los campos de contacto asociados a sus usuarios para que almacenemos el campo de contacto durante el proceso de creación de contactos. El field_id se encuentra en el módulo Contact Fields.

  • El script para identificar a los usuarios conectados debe colocarse sobre el código del chat del sitio web que se encuentra en el diálogo de configuración del chat del sitio web.

  • Tenga en cuenta que si utiliza esta función, se ignorará el formulario previo al chat, lo que significa que los contactos no tienen que rellenar su información antes de iniciar una conversación.

<script>
    window.__okeybot_settings = {  
    identifier: 'customer@example.com',
    firstName: 'Jane',
    lastName: 'Doe',
    phone: '60123456789',
    email: 'customer@example.com',
		// Custom Fields
    custom_fields: {
	    // slugs of custom fields
      order: 1234,
      business_plan: 'Enterprise',
    },
  };
</script>
<!-- This site is converting visitors into subscribers and customers with https://okeybot.com -->
<script id="okeybot__widget" src="https://cdn-staging.okeybot.com/webchat/widget/widget.js?cId=ac37d6ced587cab720c5b05a1bc209c331c66c19b1e7e6069e5807491fb2a7dc">
</script>
<!-- https://okeybot.com -->

En el ejemplo anterior se pasa la dirección de correo electrónico como identificador y durante el proceso de creación del contacto, se almacenarán todos los campos del contacto pasados.

Control Programático (API para usuarios)

El widget de chat del sitio web se puede abrir y cerrar a través del código JavaScript de su sitio web. Esto le permite crear un botón personalizado de "Chatear con nosotros" en su sitio web y activar el widget de chat del sitio web para que se abra cuando un visitante haga clic en el botón.

Acciones

  1. Abrir chat

    • Descripción: Abrir el widget de chat.

    • Sintaxis: $okeybot.do("chat:open")

  2. Cerrar chat

    • Descripción: Cerrar el widget de chat.

    • Sintaxis: $okeybot.do("chat:close")

Oyentes de eventos

  • Se abrió el chatbox

    • Descripción: Maneja el evento abierto del widget de chat (activa la función de devolución de llamada).

    • Sintaxis: $okeybot.on("chat:opened", callback)

  • Se cerró el chatbox

    • Descripción: Maneja el evento cerrado del widget de chat (activa la función de devolución de llamada).

    • Sintaxis: $okeybot.on("chat:closed", callback)

Métodos de comprobación de estados

  • ¿Está abierto el chat?

    • Descripción: Devuelve true si se abre el widget de chat, de lo contrario, false.

    • Sintaxis: $okeybot.is("chat:open")

  • ¿Está cerrado el chat?

    • Descripción: Devuelve true si se cierra el widget de chat, de lo contrario, false.

    • Sintaxis: $okeybot.is("chat:closed")

Solucionar problemas

Los mensajes no se pudieron enviar el contacto

Puede haber varias razones por las que los mensajes fallaron:-

  1. El contacto ha abandonado el sitio web.

  2. La inactividad del contacto puede exceder el período de tiempo de espera.

  3. El cliente del contacto puede tener problemas de conexión a Internet

Widget que no aparece en el sitio web

Asegúrese de que el código está instalado correctamente. Consulte las instrucciones sobre cómo instalar el widget de chat del sitio web.

Asegúrate de poner en la lista blanca el sitio web donde se va a instalar el widget. Consulta el paso 3 de esta para saber cómo poner tu dominio en la lista blanca.

¿Tienes problemas con el canal? ¡Contáctanos !

🌐
📌
Instalar en WordPress
Instalar en Shopify
Instalar en Wix
Instalar en Squarespace
aquí
aquí
sección
canales de mensajería