¿Cómo podemos ayudar?

Este artículo constituye una guía completa para configurar e integrar el widget de chat en su sitio web, para que pueda ofrecerle a sus clientes la posibilidad de comunicarse con sus servicios y agentes a través del chat.

Siga los pasos que se indican en este artículo para aprovechar al máximo el canal de chat. Añada valor a su sitio web configurando e integrando el widget de chat, garantizando su disponibilidad para los clientes.

Para facilitar la navegación, utilice el siguiente índice:

• Excepciones del Firewall
  • • Política de Seguridad de Contenido (CSP) - Chat Widget V1
    • Política de Seguridad de Contenido (CSP) - Chat Widget V2
    • Seguridad OneTrust
• Crear un Touchpoint de chat
  • • Dominio
    • Crear una Instancia de Chat Regional
• Chat App
• Touchpoint de Chat
  • • Pestaña Touchpoint
      • Conectarse al Flujo de Comentarios
    • Pestaña Customization
      • Pestaña Appearance
      • Preferencias
        • Activar/Desactivar la Descarga de Transcripciones de Chat
        • Mostrar Nombre del Agente
        • Personalizar el Nombre y el Avatar de Autopilot
    • Pestaña de Engagement
      • Inicio de la Conversación
      • Pantalla inicial
      • Inicio rápido
    • Pestaña Settings
      • Vista Previa de la Conversación
• Integración del Chat Widget
  • • Integración del Widget a través de secuencias de comandos
• Personalización de Chat Widget
• Variables de Contexto
  • • Variables de Contexto Recibidas de la Pantalla Inicial
    • Variables de Contexto Recibidas del Sitio Web
    • Posibles Aplicaciones de las Variables de Contexto
• Identificación de Visitantes
  • • Creación e Identificación manual de un contacto
    • Creación e Identificación Automática de un Contacto
• Recursos Adicionales

 

Excepciones del Firewall

Cuando un sitio web tiene activada la Política de Seguridad de Contenidos (CSP), restringe los tipos de contenidos que se pueden cargar en el sitio. Para garantizar que las funcionalidades de chat se ejecuten de forma satisfactoria, se deben incluir fuentes específicas en la lista blanca.

 

Política de Seguridad de Contenido (CSP) - Chat Widget V1

A continuación, se describe la configuración de CSP necesaria para Chat Widget V!, incluyendo las regiones de Talkdesk td-us-1, td-eu-1, td-ca-1 y td-usfed-1, para garantizar el correcto funcionamiento del chat en el sitio web.

 

Dominios de CSP

A continuación, se describe el propósito de los dominios de CSP. Cada uno de estos dominios cumple un papel crucial para habilitar los servicios de chat, especificando las fuentes confiables desde las cuales se puede cargar el contenido, garantizando tanto la funcionalidad como la seguridad para los usuarios en sus respectivas regiones.

 

Política de seguridad de contenidos (CSP) - Chat Widget V2

A partir del 19 de julio de 2024, al crear un touchpoint de chat, el sistema generará de forma automática el Chat Widget V2. A continuación, se describe la configuración de CSP necesaria para el Chat Widget V2, incluyendo las regiones de td-us-1, td-eu-1, td-ca-1 y td-usfed-1 de Talkdesk, para garantizar que el chat funcione de forma adecuada en el sitio web.

 

Dominios de CSP

A continuación, se describe el propósito de los dominios de CSP. Cada uno de estos dominios cumple un papel crucial para habilitar los servicios de chat, especificando las fuentes confiables desde las cuales se puede cargar el contenido, garantizando tanto la funcionalidad como la seguridad para los usuarios en sus respectivas regiones.

 

Seguridad OneTrust

Si su sitio web utiliza OneTrust, tome en consideración que, como parte de su funcionamiento, OneTrust utiliza el comando OtAutoBlock.js para bloquear comportamientos sospechosos, por lo que se puede bloquear su carga y, por ello, es posible que el launcher del chat no se muestre en el sitio web.

Le recomendamos que añada Talkdesk Chat a su configuración de confianza de OneTrust. Para ello:

• Inicie sesión en su cuenta de OneTrust.
• Vaya hasta los ajustes de la gestión de secuencias de comandos.
  • • Los ajustes para gestionar la carga de secuencias de comandos se suelen encontrar en las secciones "Cookie consent" o "Script management".
• Defina las secuencias de comandos de la lista blanca:
  • • Añada sus archivos remotos JavaScript de confianza (https://talkdeskchatsdk.talkdeskapp.com/v2/talkdeskchatsdk.js) o dominios a la configuración.
    • Nota: Las secuencias de comandos que no figuren en la lista blanca se bloquearán hasta que el usuario otorgue su consentimiento.

 

Crear un Touchpoint de Chat

Para crear un nuevo "Chat touchpoint", vaya a "Admin" > "Channels" > "Chat" y haga clic en el botón Create touchpoint.

Se abrirá una ventana pop-up en la que se le pedirá que indique el dominio (obligatorio) y el nombre descriptivo (obligatorio) del nuevo touchpoint de chat. Haga clic en Create.

El nuevo touchpoint de chat ahora se podrá ver en la lista y estará inactivo por defecto. Haga clic en el dominio del touchpoint para completar su configuración.

Busque la sección "Touchpoint" y haga clic en Edit.

Ahora puede seleccionar el flujo de Studio que se debe asignar al nuevo touchpoint de chat. Haga clic en Save para volver a la página de configuración.

Elija la pestaña Customization y haga clic en Edit. Aquí tiene la opción de personalizar el contenido del widget de chat, por ejemplo:

• Mensaje de bienvenida.
• Campos (información del cliente).
• Menús desplegables (por ejemplo, selección de idioma).
• Mensajes (información valiosa).
• Botones de acción (por ejemplo, "Start chat").

Integrar el widget de chat en las páginas deseadas de su sitio web. Esto puede hacerse a través de iframe (opción recomendada) o a través de secuencias de comandos. Consulte la sección "Integración de Widget" para obtener más información.

Después de integrar el widget de chat en su sitio web, vaya a "Admin" > "Channels" > "Chat" > Touchpoint.

En la pestaña Touchpoint, haga clic en Edit.

Ahora puede activar el touchpoint de chat deslizando el selector "Status". Pulse Save para guardar su progreso.

Vuelva a cargar su sitio web y debería poder ver el widget de chat en las páginas web en las que estaba integrado.

Al configurar el touchpoint de chat, tenga en cuenta las siguientes directrices:

 

Dominio

• Protocolos y "www."

El sistema diferencia entre los dos protocolos disponibles ("http:" y "https:") y no diferencia entre dominios que incluyen "www." y dominios que no incluyen "www.".

Sin embargo, es posible eliminar la información del protocolo y funcionará para todas las combinaciones.

 

Implementar en un Dominio y sus Subdirectorios

Notas:

• Todos los subdirectorios como https://www.talkdesk.com/abc bajo la www.talkdesk.com son compatibles para desplegar el touchpoint de chat.

• La conversación de chat continuará mientras el contacto navega entre las páginas y las subpáginas dentro del dominio. Esto garantiza una comunicación ininterrumpida.

 

Despliegue en Subdominios

Notas:

• El despliegue de subdominios utiliza comodines (*) para hacer coincidir subdominios. Todos los subdominios que terminan con talkdesk.com son compatibles para implementar el touchpoint de chat.

• La conversación de chat NO se transferirá cuando una contact person vaya a un subdominio diferente. Esto ofrece una clara separación de las conversaciones entre subdominios.

 

Despliegue en Una Página

Nota: El sistema utiliza "http:" y "https:" para identificar el enlace que se va a desplegar. Cualquier dominio que comience con estos términos sólo se desplegará en el enlace específico. Los subdirectorios bajo un enlace de dominio como http://www.talkdesk.com/abc/def.html no son compatibles para desplegar el touchpoint de chat

 

Crear una Instancia de Chat Regional

Cuando se crea un touchpoint de chat, se crea una instancia de chat regional basada en la región de despliegue del touchpoint de chat. Las instancias de chat regionales sirven como centros de datos distintos a nivel global, facilitando el procesamiento y almacenamiento esenciales para las funcionalidades de comunicación de su aplicación. Por ejemplo:

• Los administradores que creen un touchpoint de chat en la región de los Estados Unidos crearán de forma automática una instancia regional de chat para la misma región.
• Los administradores que creen un touchpoint de chat en la región de la UE, crearán de forma automática una instancia regional de chat en la UE después del 30 de mayo de 2024.
  • Se deben agregar las siguientes excepciones de firewall para la región de la UE.
    • • https://api.talkdeskapp.eu
      • wss://tsock.ie1.twilio.com/v3/wsconnect
      • https://mcs.ie1.twilio.com
      • https://media.ie1.twilio.com
  • Es necesario añadir las siguientes políticas de seguridad CSP para las regiones de la UE.
    • • https://api.talkdeskapp.eu
      • wss://tsock.ie1.twilio.com
      • https://mcs.ie1.twilio.com
      • https://media.ie1.twilio.com

Notas:

• Los touchpoint de chat creados en la región de los Estados Unidos antes del 30 de mayo de 2024 se seguirán conectando con la instancia de chat regional correspondiente ubicada en los Estados Unidos. Si desea migrar la aplicación de chat de la región de la UE existente a la instancia de chat de la UE, siga las instrucciones del artículo Migración de los Touchpoint de Chat de la UE. El documento descargable también se puede encontrar al final de este artículo.
• Los touchpoint de chat creados en la región de CA siguen conectándose con la instancia de chat regional ubicada en EE. UU.

 

Chat App

Acceda a Workspace y vaya a "Admin" > Channels. En la pestaña "Channels list", encontrará el canal "Chat". Selecciónelo para configurar todos los Touchpoint de Chat.

• Channels list: Los canales disponibles en su cuenta. Seleccione Chat para configurar los touchpoint del canal.
• Global settings: Ajustes aplicables a uno o varios canales. Por ejemplo, la definición de la importancia de la ocupación de cada conversación para cada canal.
• Templates: Cree mensajes previamente redactados para ayudar a los agentes a que sean más eficientes.
• Chat channel: Para configurar este canal, haga clic en la sección Chat dentro de la aplicación "Channels".
• Number of touchpoints: Esta etiqueta indica el número de touchpoint que ya se han configurado para el chat.

Utilice el botón Create new touchpoint para crear un nuevo touchpoint. Una vez que haga clic, se le pedirá el dominio del sitio web y un nombre descriptivo para el Touchpoint.

Si hace clic en el botón "More options" (...), podrá:

• Editar el Touchpoint de Chat.
• Editar la apariencia del chat.
• Duplicar las configuraciones de apariencia a un nuevo Touchpoint (se le pedirá el dominio y el nombre descriptivo).
• Activar o desactivar el touchpoint.
• Eliminar el touchpoint (solo es posible si primero desactiva el chat. Nota: Tenga en consideración que también tiene que eliminar el código del widget del sitio web).

 

Touchpoint de Chat

Para cada chat Touchpoint hay cuatro pestañas:

• "Touchpoint"
• “Personalización”
• "Compromiso"
• "Ajustes"

Touchpoint: En esta pestaña puede configurar el dominio de su sitio web, asignar un flujo de Studio, conectarse a un flujo de comentarios y copiar el código widget para añadirlo a su sitio web.

Nota: El fragmento de código solo está disponible en el modo de visualización.

Customization: En esta pestaña podrá personalizar la apariencia, el color de la marca, el logotipo de la marca, el launcher del chat y las preferencias del widget de chat.

Engagement: En esta pestaña podrá personalizar el formulario inicial y el mensaje de chat de widget del chat.

Settings: En esta pestaña podrá configurar el permiso de vista previa de conversaciones en la aplicación Inbox en función de los touchpoint y los roles.

Para pasar a la pestaña seleccionada del modo de vista al modo de edición, pulse el botón Editar.

 

Pestaña Touchpoint

Al entrar en la pestaña Touchpoint, estará en el modo de visualización. Para cambiar al modo de edición, haga clic en el botón Edit para comenzar a configurar su touchpoint de chat.

Utilice "Domain" para añadir la URL del sitio web en el que desea que aparezca el widget (consulte las directrices que están disponibles aquí). En el campo "Friendly name", indique un nombre descriptivo para el Touchpoint, es decir, el nombre que se mostrará a los agentes.

Luego, seleccione en el menú desplegable el Studio flow que se asignará al Touchpoint.

Cuando configure el chat por primera vez, puede abrir el enlace Configure a Studio flow, que le redirigirá a Studio, para que pueda crear un flujo de Studio.

 

Nota: Puede cambiar el flujo de Studio asignado tantas veces como sea necesario, sin tener que cambiar el fragmento de código en su sitio web.

 

Deslice el conmutador "Status" para activar o desactivar el Touchpoint de Chat. Pulse Save para guardar su progreso.

 

: Una vez añadido el código del widget al sitio web, el widget de chat aparecerá para todos los visitantes del sitio web.

 

: Al desactivarlo, el widget de chat desaparecerá del sitio web. Las conversaciones en curso no se perderán, pero el visitante no podrá iniciar otra conversación.

Nota: El botón Save solo se activará una vez que añada el dominio y seleccione un flujo de Studio.

Después de guardar sus configuraciones, volverá al modo de visualización, donde podrá ver la configuración aplicada y el código del widget que debe añadir a su sitio web.

En "Domain Information", puede ver el dominio, el nombre descriptivo del dominio y el Studio flow asignado.

Después de guardar las configuraciones del Touchpoint, se generará el código del widget. Consulte esta sección para obtener más información sobre cómo añadir el código del widget a su sitio web.

 

Nota: La sección de código del widget solo se muestra en el modo de visualización.

 

Conectarse al Flujo de Comentarios

Busque la opción "Connect to Feedback flow" y utilice el menú desplegable para seleccionar el flujo de comentarios que desea asignar al touchpoint.

También puede abrir el enlace Configure a Studio flow [1] para acceder al flujo de comentarios y crear una encuesta de chat.

Para desconectar una encuesta de chat del touchpoint de chat, pulse el icono "x" a la derecha del nombre del flujo.

 

Pestaña Customization

Al entrar en la pestaña Customization, estará en modo de visualización. Para cambiar al modo de edición, haga clic en el botón Edit para comenzar a configurar la apariencia de su chat.

Pestaña Appearance [1]: Personalice el tema, el color y el icono del widget de chat, incluyendo el color de la marca, la marca, el iniciador de chat y el color del iniciador.

Pestaña Preference [2]: Aquí puede habilitar, deshabilitar y configurar los ajustes generales del widget de chat, como el botón de finalización de chat, la descarga de la transcripción del chat, el indicador de escritura, la visualización del nombre del agente, la personalización del autopilot, etc.

Preview [3]: Vista previa de las pantallas del widget de chat

 

Pestaña Appearance

Al entrar en la pestaña "Appearance", podrá comenzar a configurar la apariencia de su chat. Las siguientes funcionalidades estarán disponibles para su edición:

Dentro de "Chat Widget", puede seleccionar "Brand color" para elegir el color del tema del widget de chat que coincida con sus preferencias de marca. Esta selección actualizará varios elementos del widget de chat, incluido el fondo del encabezado, el texto del encabezado y el color de fondo del widget, entre otros.

Si selecciona la opción "More color settings", podrá especificar y obtener una vista previa de los colores del widget de chat para alinearlos con su marca. Estas opciones son:

• "Header background": El color de fondo del encabezado.
• "Header text": El color del texto del encabezado.
• "Welcome message background": El color de fondo del mensaje de bienvenida en la pantalla inicial del formulario.
• "Welcome message text": El color del texto del mensaje de bienvenida en la pantalla inicial del formulario.
• "Widget background": El color de fondo del widget de chat.
• "Action button": El color de fondo, contorno o frontal del botón de acción, incluyendo: el "botón Start chat", el "botón Start new chat", el "botón End chat", el "botón Cancel chat" y los botones de acción (digital component carousel, quick reply, etc.).
• "Agent’s bubble": El color de fondo de la burbuja de chat de un agente.
• "Agent’s text": El color del texto de un mensaje de chat de un agente.
• "Customer’s bubble": El color de fondo de la burbuja de chat del cliente.
• "Customer’s text": El color del texto del mensaje de chat del cliente.

• "Branding - Logo URL" [1]: Ingrese una URL para personalizar y obtener una vista previa de los logotipos de la marca en Chat Widget.
• "Title" [2]: Introduzca el título y la descripción para personalizar y previsualizar las marcas en Chat Widget.
• "Chat launcher - Icon URL" [3]: Ingrese una URL para personalizar y obtener una vista previa del icono del launcher de chat.
• "Launcher color" [4]: Seleccione un color para personalizar y obtener una vista previa del color de fondo del launcher de chat.

Preference

Al expandir la pestaña "Preference", verá una vista previa de cómo se verá el widget en la sección Preview style.

También podrá configurar las siguientes funcionalidades activando o desactivando los respectivos selectores:

• Botón "Close conversation": Activa o desactiva la opción que permite a los visitantes cerrar la conversación de chat (aparecerá en el encabezado del widget de chat).
• Indicador de escritura: Activa/desactiva la visibilidad del indicador de que el agente o el contacto está escribiendo (o de que Autopilot está cargando la respuesta).

Después de guardar sus configuraciones, volverá al modo de visualización, donde podrá ver las configuraciones aplicadas y qué contenido se mostrará en el widget de chat. Una etiqueta de estado indica si la opción “Close conversation" está habilitada o no.

 

Activar/desactivar la Descarga de Transcripciones de Chat

La función de descarga de transcripciones de chat permite a los usuarios ver o archivar el historial de conversaciones importantes descargando las transcripciones de chat directamente desde el widget de chat.

Utilice el botón resaltado para activar o desactivar la opción que permite a los contactos descargar la transcripción del chat. Esta opción estará disponible en el menú More Options (tres puntos).

Una vez activada la opción «Descargar transcripción», los contactos pueden localizarla en el menú del widget de chat y hacer clic para descargarla como texto sin formato. Se podrá acceder al archivo descargado desde la lista de descargas del navegador, para futuras referencias y para fines de registro.

 

Muestre el nombre del agente

Cuando este selector esté activo, los contactos podrán ver el nombre del agente en sus mensajes y se mostrará un mensaje informativo cuando el agente se haga cargo: por ejemplo, "Graham Shaw se encargará de su chat". Los admin puede personalizar la pantalla para que aparezca el nombre completo del agente, su nombre, su apellido o un nombre específico.

 

Personalizar el Nombre y el Avatar de Autopilot

Active el selector "Customize autopilot's name" [1] para personalizar el nombre del autopilot. Los contactos pueden ver el nombre del autopilot bajo los respectivos mensajes. El nombre predeterminado es "ChatBot".

Para personalizar el avatar del autopilot [2], active el selector y configure el avatar del autopilot proporcionando la URL de un avatar. Los contactos podrán ver el avatar del autopilot bajo los respectivos mensajes.

 

Pestaña Engagement

Inicio de la Conversación

Al entrar en la pestaña Engagement, estará en modo de visualización. Para cambiar al modo de edición, seleccione el botón Edit para comenzar a configurar. Al expandir la pestaña "Conversation", podrá activarla o desactivarla.

Habilitar o Desactivar "Chat immediately"

El selector "Chat immediately" ofrece una forma sencilla de iniciar conversaciones de chat sin requerir ninguna intervención por parte del usuario. Por ejemplo, cuando está habilitado y el formulario inicial está desactivado:

• La conversación por chat comienza instantáneamente cuando el usuario hace clic en el icono de inicio de chat.
• La contact person será dirigida en función del Studio Flow configurado, ya sea a Autopilot o a un agente en directo, lo que reduce la fricción y permite una asistencia inmediata.

Nota: En el Chat Widget V2, esta función sustituye a la anterior casilla de verificación “Route conversation immediately after the user clicks this button". Los touchpoint de chat existentes pasan de forma automática a la nueva configuración, lo que garantiza que los flujos de Studio se activen tan pronto como el usuario interactúe con el botón de chat.

 

Pantalla Inicial

Al desplegar la pestaña "Initial screen", podrá activar y configurar sus componentes.

Utilice el selector "Show/Hide initial screen" [1] para activar o desactivar la pantalla inicial del widget de chat.

 

Nota: El "Preview style" [2] se actualizará cada vez que realice un cambio en sus componentes.

 

Añada un "Welcome message" [3] en la parte superior del widget de chat para darle la bienvenida a sus visitantes. Puede estar compuesto por un título de hasta 20 caracteres y un texto de hasta 120 caracteres.

Nota: Las URL añadidas a estos elementos serán enlaces en los que se podrá hacer clic.

Luego, puede crear un formulario de conversación previa para conseguir información del visitante que puede utilizarse con fines de enrutamiento o para facilitar contexto adicional a sus agentes.

Tenga en cuenta que, por defecto, hay un mensaje personalizado, un campo personalizado, un menú desplegable personalizado y un botón personalizado. Estos componentes por defecto no se pueden eliminar, pero solo se mostrarán si los configura.

Puede usar el botón + Add field para añadir otro componente personalizado a la pantalla inicial, según el tipo que seleccione:

• "Button"
• "Dropdown"
• "Field"
•  "Message"

El "Custom button" añade un botón (al que puede asignar una etiqueta) para activar una acción. Actualmente, solo existe una opción de activación: "Start the chat".

 

Nota: Active la opción "Route conversation immediately after the user clicks this button" si desea que el flujo de Studio se active en cuanto el usuario haga clic en el botón. Si está desactivada, el usuario tiene que enviar un mensaje para activar el flujo de Studio.

Con el "Custom dropdown" puede añadir un menú desplegable personalizado a la pantalla inicial.

En el "Custom field" podrá añadir un campo de entrada a la pantalla inicial, que permitirá al visitante introducir información. Puede añadir la etiqueta del campo en el cuadro de texto y luego asignarla al valor que está recopilando.

 

Nota: Por ejemplo, si desea solicitar la dirección de correo electrónico del visitante, escriba "Email" como nombre del campo personalizado y seleccione la opción "Contact email" del menú desplegable. En caso de que quiera solicitar otro tipo de información (por ejemplo, el número de pedido), puede definir el valor del campo personalizado como "Custom option".

La opción de añadir un "Custom message" añadirá un mensaje a la pantalla inicial. Al activar el conmutador "Chat bubble", el mensaje se mostrará dentro de una burbuja de chat.

Si elimina un campo mediante el icono correspondiente, ese componente personalizado desaparecerá de la pantalla inicial.

 

Nota: Los componentes por defecto no se pueden eliminar y, por tanto, es necesario eliminar su configuración para ocultarlos de la pantalla inicial.

 

El conmutador "Required" establece qué campos son opcionales y obligatorios antes de que el visitante pase a la pantalla del chat. Cada componente dispone de una herramienta de arrastrar y soltar que le permitirá cambiar el orden de presentación de los componentes en la pantalla inicial.

Después de guardar las configuraciones, volverá al modo de visualización y verá la configuración aplicada y qué contenido se mostrará en el widget de chat.

Verá una etiqueta de estado que indica si la pantalla inicial está habilitada o no, así como una vista previa de su configuración.

Para cada campo personalizado o menú desplegable personalizado, se generará un valor "Studio Argument". Cada argumento se puede asignar al componente "Incoming Message" del flujo de Studio del touchpoint para facilitar contexto a los agentes o con fines de enrutamiento.

 

Quickstart

Al expandir la sección "Quickstart", puede editar la siguiente configuración.

Mensajes

En la sección Mensajes [1] puede agregar mensajes estáticos que aparecerán una vez que el visitante esté en la pantalla de chat.

De forma predeterminada, hay un cuadro de entrada [2] para agregar un mensaje, pero solo se mostrará si lo configura. Puede agregar tantos mensajes como quiera haciendo clic en el botón Agregar otro mensaje [3].

Consejo: Vuelva a vaciar el mensaje para evitar que los mensajes aparezcan en la pantalla de chat.

Cada mensaje dispone de una herramienta de arrastrar y soltar que le permitirá cambiar el orden de presentación de los mensajes en la pantalla del chat.

 

Inicio rápido

En la sección "Inicio rápido" [4], puede seleccionar un inicio rápido de la lista desplegable para asociarlo con el Touchpoint de chat. Cuando se abre el widget de chat, la opción de inicio rápido que está seleccionada aparecerá al instante.

 

Vista previa de inicio rápido

Esta vista previa [5] mostrará el widget de chat, para que pueda ver el color y el estilo del Quickstart seleccionado.

Después de guardar sus configuraciones [6], volverá al modo de visualización, donde se mostrarán las configuraciones aplicadas, así como el contenido que se mostrará en el widget de chat.

 

Pestaña Settings

En la pestaña "Settings", puede configurar los ajustes a nivel del touchpoint, así como ver un resumen de la configuración actual de los ajustes disponibles. Haga clic en el botón Edit del touchpoint deseado para configurar los ajustes.

 

Vista Previa de la Conversación

Con la opción "Conversation Preview", tiene la posibilidad de conceder o restringir a determinados roles la vista previa de las conversaciones de chat directamente desde la aplicación "Inbox".

• Allow previews: Pulse el selector para activar o desactivar la vista previa de la conversación. Si se activa, todas las conversaciones de este Touchpoint podrán ser previsualizadas por los usuarios autorizados.
• Authorized roles: Cuando la opción "Allow previews" está activada, puede seleccionar los roles que pueden previsualizar las conversaciones del touchpoint.

 

Integración de Chat Widget

Integración del Widget a través de Secuencias de Comandos

Acceda a "Admin" > "Channels" > "Chat" > "Touchpoint". En la pestaña Touchpoint en modo de visualización, localice la sección de código del widget.

Seleccione el fragmento de código y haga clic en el botón Copy. Pegue el fragmento de código antes de la siguiente etiqueta de cierre en su propio sitio web:

• </body>

Nota: Cópielo en todas las páginas en las que desee que aparezca el widget de chat.

 

Personalización de Chat Widget

Para adaptar mejor el widget de chat a las características de su sitio web, puede personalizar el aspecto del widget y la experiencia del usuario. Consulte este artículo para obtener más información.

 

Variables de Contexto

El componente de paso inicial en el flujo "Incoming Message" en Studio le permite aportar contexto procedente del widget de chat.

Es posible recopilar variables context de las siguientes maneras:

• Data provided by the visitor: Se solicita información en la pantalla inicial a través de campos personalizados y desplegables personalizados. Posteriormente, el visitante rellenará la información solicitada.
• Data provided by your system: Se recibe información de su sitio web cuando el visitante abre el widget de chat o cuando inicia una conversación de chat.

 

Nota: Puede usar ambos modos al mismo tiempo.

 

Las variables recopiladas deben asignarse al componente "Incoming Message" del Studio flow que se asigna al Touchpoint de Chat. Después de eso, puede utilizarlos para gestionar qué variables desea presentar a sus agentes como contexto adicional para fines de enrutamiento o crear integraciones con otros Talkdesk Products.

 

Variables de Contexto Recibidas de la Pantalla Inicial

Vaya a "Admin" > "Channels" > "Chat" > "Touchpoint", abra la pestaña "Appearance" y haga clic en el botón Edit. Active la pantalla inicial y añada los campos que recopilarán el contexto que necesita. Para obtener más información, consulte esta sección.

Verifique los argumentos Studio relacionados con cada campo de la pantalla inicial. Para más información sobre los argumentos de Studio, lea los siguientes artículos:

• Digital Engagement: Configuración de Studio para Administradores
• Studio: Trabajando con Variables

Abra el Studio flow del Touchpoint en modo de edición. Seleccione el componente Incoming Message, añada los argumentos y asigne las variables de flujo respectivas:

• "Argument name": Copie el nombre del argumento del campo que aparece en la pestaña "Appearance" (modo de visualización) y péguelo en el cuadro de entrada del argumento.
• "Map to flow variable": Para las variables de datos de contacto, se debe aplicar la siguiente nomenclatura:
  • field_name1 > contact_name
  • field_number1 > contact_number
  • field_email1 > contact_email
• Para cualquier otro argumento, se puede aplicar cualquier otro nombre de variable.

Finalice la configuración según sus necesidades y haga clic en Save.

 

Variables de Contexto Recibidas del Sitio Web

En el código del widget, busque la sección comentada con la siguiente función y descoméntela:

• setContext()

Ejemplo: Recepción de variables al iniciar la conversación (con variables estáticas).

Luego, busque la función que se muestra a continuación y modifique sus parámetros para pasar los datos deseados:

• webchat.setContextParam()

Ahora elegirá cuándo desea recibir las variables context de su sitio web.

Para recibirlas cuando se inicie la conversación, conserve la función:

• { setContext() }

Y luego elimine la función:

• webchat.onOpenWebchat = function() { setContext() }

Para recibirlas cuando el widget de chat esté abierto, conserve la función:

• webchat.onOpenWebchat = function() { setContext() }

Y luego elimine la función:

• webchat.onConversationStart = function() { setContext() }

Los nombres de las variables que ha añadido a la función que se muestra a continuación corresponden a los argumentos de Studio:

• webchat.setContextParam()

Abra el Studio flow de Touchpoint en modo de edición. Seleccione el componente Incoming Message, añada los argumentos y asigne las variables de flujo respectivas:

• "Argument name": Copie el nombre de la variable que ha añadido al código del widget dentro de la función "webchat.setContextParam" y péguelo en el cuadro de entrada de argumentos.
• “Map to flow variable”: Para las variables existentes, debe aplicarse la siguiente nomenclatura:
  • argumento que recopila el nombre ➞ contact_name
  • argumento que recopila el número ➞ contact_number
  • argumento que recopila el correo electrónico ➞ contact_email
• Para cualquier otro argumento, se puede aplicar cualquier otro nombre de variable.

Finalice la configuración del flujo de Studio y pulse Save para guardar las configuraciones.

 

Posibles Aplicaciones de las Variables de Contexto

Mostrar Contexto Adicional a los Agentes

En la sección "Manage context" del Studio flow del Touchpoint, puede definir el contexto que se mostrará a sus agentes. Para ello, abra el flujo de Studio en modo de edición y haga clic en este botón: . Luego, seleccione las variables a las que desea que su agente tenga acceso durante la conversación de chat.

Ejemplos recibidos de la pantalla inicial y un ejemplo recibido del sitio web.

 

Tarjeta de datos de contacto

Al recibir el nombre, el número de teléfono y la dirección de correo electrónico del visitante, puede rellenar la tarjeta de datos de contacto.

Para ello, necesita exponer esas variables como contexto en la sección "Manage contex". Abra el flujo de Studio en modo de edición y haga clic: . Luego, seleccione las variables correspondientes a los datos de contacto.

 

Nota: Si recibe un número de teléfono válido, el agente podrá elegir ese número cuando haga clic para llamar al visitante.

 

Enrutar Conversaciones a partir de Condicionales

Con el componente Conditional Statement, puede dirigir una conversación de chat a una cola que cumpla las condiciones predefinidas.

Puede utilizar las variables de contexto para establecer estas condiciones y, posteriormente, utilizar el componente "Assign agents to message" para establecer la cola a la que se debe dirigir la conversación de chat.

 

Otras Posibles Aplicaciones

Existen varios usos para las variables context dentro de los diferentes componentes de Studio, por ejemplo, asignar una conversación a un ring group basándose en el valor de la variable en el componente "Assign agents to message".

Estas variables también se pueden pasar a sistemas externos a través de integraciones o automatizaciones que es posible configurar dentro del sistema de Talkdesk.

 

Identificación de Visitantes

En la Conversations app, un visitante se identificará como "Visitor #NNN" si no se crea o asigna ningún Contact al visitante durante la conversación de chat.

 

Nota: Si se rellena el campo "Name" de la tarjeta "Contact Details", el visitante se identificará con ese nombre en la pestaña Assigned to you, aunque no se guarde el contacto.

En Reporting, un visitante será identificado como "Visitor #NNN" si no se ha creado o asignado ningún Contact al visitante cuando se esté gestionando una conversación de chat.

La identificación de los visitantes puede hacerse manual o automáticamente en función de cómo se consiga la información de contacto. Las opciones son:

• El Contact se crea o identifica de forma manual cuando el visitante facilita los datos:
  • Opción 1: El visitante facilitará la información solicitada y el agente rellenará la tarjeta "Contact Details" y luego la guardará como un nuevo contacto o la fusionará con un contacto existente.
  • Opción 2: El visitante rellenará la información solicitada en la pantalla inicial del Widget de Chat, y el agente validará la información que se ha rellenado en la tarjeta "Contact Details". Luego puede guardarse como un nuevo contacto o fusionarse con uno ya existente.

En estos casos, si el mismo visitante vuelve a ponerse en contacto y facilita la misma información de contacto, Talkdesk no identificará al visitante automáticamente.

Nota: El Contact no se crea de forma automática para que los agentes puedan verificar la fiabilidad de la información facilitada. Este paso es esencial, ya que no existe ninguna prevención para los datos de contacto incorrectos o erróneos introducidos por los usuarios en el formulario de conversación previa, incluida la posibilidad de introducir los datos de contacto de otra persona.

 

• El Contact se crea o identifica de forma automática cuando los datos son facilitados por su sistema al recibir la información de contacto desde su sitio web, utilizando la función "Chat User Identification".

Esta función le permite enviar la dirección de correo electrónico o el número de teléfono del visitante a Talkdesk, a través de una variable designada en el código del Widget de Chat. Cuando el visitante inicia una conversación por chat, el sistema recibe el número de teléfono o la dirección de correo electrónico del visitante y luego lo guarda automáticamente como nuevo contacto o lo relaciona con un contacto existente.

En este caso, si el mismo visitante vuelve a ponerse en contacto, Talkdesk identificará al contacto.

La función "Chat User Identification" es útil para las secciones del sitio web que exigen la autenticación del usuario. Con esta función, los visitantes pueden ser identificados de forma fiable, garantizando que la información que se envía procede del usuario que inicia la conversación de chat.

Nota: Talkdesk sólo creará el Contact si el número de teléfono o la dirección de correo electrónico recibidos tienen un formato válido.

 

Creación e Identificación Manual de un Contacto

Cuando la información de contacto es facilitada por el visitante, los agentes deben decidir si crean (o no) un nuevo contacto o asignan (o no) la conversación de chat a un contacto existente. Esto se debe a que el agente necesita validar la información facilitada.

 

Uso de un Formulario de Conversación Previa para Recopilar la Información del Contacto

Vaya a "Admin" > "Channels" > "Chat" > "Touchpoint". Abra la pestaña "Appearance" y haga clic en Edit.

Amplíe la sección de la pantalla inicial. Ahora, añada campos personalizados y defínalos como "Contact name", "Contact number" y "Contact email".

Haga clic en "save" y compruebe los argumentos de Studio.

Abra el Studio flow del Touchpoint en modo "Edit". Seleccione el componente Incoming Message y añada los argumentos como se indica a continuación:

• field_name1 > contact_name
• field_number1 > contact_number
• field_email1 > contact_email

Finalice la configuración según sus necesidades y pulse Save.

Haga clic en el botón y seleccione las variables de los datos de contacto:

Cómo funciona

Si no solicita la información de contacto por adelantado, sus agentes tendrán que hacer la petición de esa información durante la conversación de chat.

Luego deben copiar y pegar esa información en la tarjeta "Contact Details" y después guardarla como un nuevo contacto o fusionarla con uno ya existente.

Si utiliza la pantalla inicial para hacer la petición de la información de contacto por adelantado, la tarjeta "Contact Details" se rellenará con esa información.

Luego los agentes deben validar qué información quieren conservar y guardarla como un nuevo contacto o fusionarla con uno ya existente.

 

Creación e Identificación Automática de un Contacto

La función "Chat User Identification" ofrece un proceso automatizado para crear e identificar a los visitantes que inician una conversación de chat con sus agentes.

Los visitantes pueden ser identificados por su número de teléfono o dirección de correo electrónico.

 

Pasos de configuración

En primer lugar, busque la siguiente función en el código del widget:

• webchat.setContextParam()

Para enviar el número de teléfono del visitante (en formato E.164) o la dirección de correo electrónico desde su sitio web al sistema Talkdesk, utilice la siguiente variable:

• td_contact_person_identification

 

Nota: Los datos se deben recibir en un formato válido.

 

Asegúrese de mantener una o dos de las siguientes funciones en esa sección del código del widget:

• webchat.onConversationStart = function() { setContext() }
• webchat.onOpenWebchat = function() { setContext() }

 

Cómo funciona

Sila variable “td_contact_person_identification” contiene un número de teléfono o una dirección de correo electrónico válidos, el sistema buscará un número de teléfono y una dirección de correo electrónico coincidentes en la lista “Contacts”.

• Si no encuentra ninguna coincidencia, se crea automáticamente un nuevo contacto. El nombre, el número de teléfono o la dirección de correo electrónico se rellenarán con el valor de la variable.
• Si encuentra una única coincidencia, se identificará el contacto.

• Si encuentra varias coincidencias, el sistema dará la opción de elegir entre varios contactos coincidentes.

Notas:

• Si el valor de la variable está vacío o tiene un formato inválido, el sistema no creará ni identificará a los visitantes de forma automática. El procedimiento manual será el que se deberá seguir. Para obtener más información, consulte esta sección.
• Si se indica el número de teléfono o la dirección de correo electrónico en la pantalla inicial, el sistema anulará dicha información en lo que respecta a la creación e identificación de contactos.

 

Recursos adicionales