Personalizar el chat de Guide usando API

Puede personalizar el aspecto y el comportamiento del chat que se implementa con Guide usando estas API relacionadas al chat.

Llamadas a la API de comportamiento de chat

Las llamadas en esta sección le permiten cambiar el comportamiento de la ventana de chat de Guide.

Establecer código de autorización

Establece un código de autorización para el flujo de oAuth. OAuth es un protocolo de autenticación. Permite que una aplicación interactúe con otra en su nombre sin revelar sus contraseñas. Se debe llamar antes de iniciar el chat.

cxone('chat','setAuthorizationCode', 'authorization_code');

Personalizar el mensaje de Contacto automatizado inicial

Cuando comienza un chat en Guide, se crea un caso La conversación completa de un agente a través de un canal. Por ejemplo, una interacción puede ser una llamada de voz, correo electrónico, chat o conversación en las redes sociales. nuevo y se agrega a la cola cuando se envía el primer mensaje de la sesión de chat. Cuando se inicia la sesión de chat, se envía un mensaje automático oculto en nombre del visitante. Esto reduce la cantidad de tiempo que los visitantes esperan a un agente. Aunque el mensaje inicial está oculto al contacto, el agente puede verlo.

El mensaje predeterminado es el texto del botón en el que el cliente hace clic para iniciar la conversación. Puede personalizar el texto del mensaje automatizado inicial de tres maneras:

• Anula el texto del botón predeterminado.

  cxone('chat','sendFirstMessageAutomatically', 'Hello');

• Cambie el mensaje inicial de forma dinámica.

  cxone('chat','setFirstAutomatedMessageContent', 'Hello, I have a question');

• Cambie el texto del mensaje en la Página de traducciones.

Hacer que el mensaje automatizado inicial sea visible para los contactos

Si desea que el visitante pueda ver el mensaje inicial automático, agregue esta llamada a su script:

cxone('chat','hideFirstSentMessage', false);

Retraso en la creación de casos

Guide crea un nuevo caso y lo agrega a la cola cuando se envía el primer mensaje de la sesión de chat. Cuando se inicia la sesión de chat, se envía un mensaje automático oculto en nombre del visitante. Esto reduce la cantidad de tiempo que los visitantes esperan a un agente. Las sesiones de chat comienzan cuando un visitante hace clic en el icono de chat para iniciar una conversación. Aunque el mensaje inicial está oculto al visitante, el agente puede verlo.

Puede configurar Guide para que espere el primer mensaje real del visitante antes de crear un caso usando esta llamada:

cxone('chat','sendFirstMessageAutomatically', false);

Habilitar el modo de juego

Permite que los visitantes jueguen al juego Snake mientras esperan a un agente.

cxone('chat','allowGameMode');

Encuesta de satisfacción automatizada

Una encuesta de satisfacción se puede detectar y mostrar automáticamente en una ventana emergente. Esto permite detectarlas y mostrarlas o no.

cxone('chat','automatedSatisfactionSurveyModal', 'false');

Llamadas a la API de información de chat

Estas llamadas le permiten personalizar la información que está disponible para los visitantes durante una sesión de chat.

Obtener ID de identidad del cliente

Devuelve el identificador único del visitante en el chat.

cxone('chat','getCustomerIdentityId');

Establecer ID de cliente

Define un identificador único para el visitante en el chat.

cxone('chat','setCustomerId', 'customer_id');

Ocultar contador de cola

El contador de cola permite que el visitante sepa en cuánto tiempo podrá ayudarlo un agente de acuerdo con su posición en la cola del agente. Puede ocultar el contador de cola después de que el visitante se haya enrutado con éxito hacia un agente. Esto permite a los agentes eliminar tarjetas de clientes de su bandeja de entrada sin que los visitante lo adviertan.

cxone('chat','hideQueueCounterAfterAssignment');

Establecer estado de actividad

Cambia el mensaje en la barra de actividades. Por ejemplo, puede usarlo para comunicar su tiempo de respuesta para una sesión de mensajería de chat Chat asíncrono en el que los contactos envían un mensaje de chat en cualquier momento y esperan una respuesta. Esto podría ser útil porque la mensajería de chat es una forma asincrónica de chat, por lo que los visitantes podrían tener que esperar para tener noticias de un agente.

cxone('chat','setStatusMessage', 'We typically reply within 3 hours.');

Establecer la imagen del agente

Cambia dinámicamente la imagen del agente que se muestra en la ventana de chat. De forma predeterminada, Guide utiliza la imagen en el perfil del agente. Cuando incluye esta llamada en su script, utiliza la imagen especificada por la URL en el snippet de código. Reemplace la URL de ejemplo con la URL de la imagen que desea que use el chat.

cxone('chat','setAgentImage', 'http://classics.com/images/agents/elizabeth_bennet.png');

Establecer nombre de cliente

Nombre del cliente es un campo en el formulario de encuesta previa al contacto que los visitantes deben completar antes de chatear con un agente en un canal de mensajería de chat Chat asíncrono en el que los contactos envían un mensaje de chat en cualquier momento y esperan una respuesta. Esta llamada API completa el campo de forma dinámica.

cxone('chat','setCustomerName', 'Elizabeth');

Establecer formato de fecha

Define el formato de fecha como formato de fecha absoluta (01/01/2022) o formato de fecha relativa (hoy, lunes).

cxone('chat','setDateFormat', 'date_format');

Establecer configuración regional

Establece la configuración regional para las traducciones en la ventana de chat.

cxone('chat','setLocale', 'locale');

Mostrar información del caso

Solo para canales de mensajería de chat Chat asíncrono en el que los contactos envían un mensaje de chat en cualquier momento y esperan una respuesta. Muestra la información del caso al visitante.

cxone('chat','showCaseInfo');

Mostrar / Ocultar el botón Enviar transcripción

Si hace visible el botón Enviar transcripción, debe configurar el canal de chat para permitir que los visitantes se envíen la transcripción del chat a sí mismos. Configure esta opción para la mensajería de chat o el chat en vivo.

cxone('chat','showSendTranscript');

cxone('chat','hideSendTranscript');

Mostrar/ocultar mensajes del sistema

Muestra u oculta mensajes del sistema como el historial de asignación de agentes.

cxone('chat','showSystemMessages');

cxone('chat','hideSystemMessages');

Condiciones de uso

Le permite poner un documento de condiciones de uso a disposición de los visitantes en la ventana de chat. Esta función agrega un botón a la ventana. Puede personalizar la etiqueta y el estilo del botón y lo que sucede cuando los visitantes lo pulsan. La acción al hacer clic puede mostrar los términos de uso como ventana interna o enlace externo.

Una ventana interna:

cxone('chat','showTermsOfUse', 'Show terms of Use', 'modal' , 'Our terms of use are ...');

Un enlace externo:

cxone('chat','showTermsOfUse', 'Show terms of Use', 'externalLink' , 'http://yourdomain.com/terms-of-use');

Para desactivar la característica:

cxone('chat','hideTermsOfUse');

Campos, etiquetas y frases personalizados

Crear y completar campos personalizados

Los campos personalizados que puede usar con esta llamada son los mismos que puede utilizar en Tarjeta de cliente. Si usa estas llamadas antes de abrir una ventana de chat, los campos del formulario de precontacto se rellenan con los datos que usted indique en la llamada a la API.

Para definir el valor de un campo personalizado de caso:

cxone('chat','setCaseCustomField', 'ident_of_custom_field', 'value_of_custom_field');

Para definir el valor de un campo personalizado de Tarjeta de cliente:

cxone('chat','setCustomerCustomField', 'ident_of_custom_field', 'value_of_custom_field');

Personalizar etiquetas y frases

Puede personalizar muchas de las etiquetas y frases que usa el chat de Guide, así como definir las personalizaciones. Si necesita cambiar las frases o etiquetas en pantalla de forma dinámica, use estas llamadas API.

Para cambiar un solo mensaje o etiqueta:

cxone('chat','setTranslation', 'key', 'your translation');

Para cambiar varios mensajes o etiquetas:

cxone('chat','setTranslations', {key1: 'your custom label', key2: 'your custom message'});

Llamadas a la API de apariencia de la ventana de chat

Puede modificar el aspecto de la ventana de chat que usa Guide.

Ocultar agente asignado

cxone('chat','hideAssignedAgent');

Ocultar encabezado

cxone('chat','hideHeader');

Mostrar avatar del cliente

cxone('chat','showCustomerAvatar');

Mostrar el botón Enviar

cxone('chat','showSendButton');

Establecer límite de caracteres para el cuadro de respuesta

cxone('chat','setReplyBoxLimit', '280');

CSS personalizado con selectores de datos

Puede personalizar la apariencia de las ventanas de chat con CSS personalizado utilizando selectores de datos en sus llamadas a la API. Los selectores de datos le permiten especificar la parte de la ventana de chat a la que desea aplicar el CSS personalizado. Defina el selector de datos utilizando el atributo data-selector. Establezca que sea igual al nombre del componente de ventana de chat que desea modificar.

Para agregar CSS personalizado con selectores de datos, use esta llamada a la API como referencia:

cxone('chat','setCustomCss', '[data-selector="CUSTOMER_MESSAGE_BUBBLE"] {color: white !important; background: black !important};');

Integrar con aplicaciones de terceros

Las llamadas en esta sección le permiten recibir notificaciones automáticas cuando ocurren ciertos eventos de chat.

Reconocer hilos activos en la ventana de chat

cxone('chat','getOngoingThreads');

Reconocer un contacto en curso en la ventana de chat

cxone('chat','getOngoingContact');

Reciba notificaciones automáticas para eventos de chat específicos

Para recibir una notificación de un evento de chat:

cxone('chat','onPushUpdate', 'event', callback);

Para recibir una notificación de más de un evento de chat:

cxone('chat','onPushUpdate', ['event', 'event', 'event'], callback);

Para recibir una notificación de todos los eventos de chat:

cxone('chat','onAnyPushUpdate', callback);