Las traducciones son generadas a través de traducción automática. En caso de conflicto entre la traducción y la version original de inglés, prevalecerá la version en inglés.
# Personalizaciones adicionales del widget de chat de Amazon Connect
Puede añadir las siguientes personalizaciones opcionales a la interfaz de usuario del chat:
+ Mostrar el botón **Finalizar chat** en el menú desplegable del encabezado en lugar de en el pie de página.
+ Enmascarar u ocultar los nombres públicos.
+ Agregar iconos de mensajes.
+ Anular los mensajes de eventos.
+ Configurar un cuadro de diálogo de confirmación que se mostrará a los clientes cuando pulsen el botón **Finalizar chat**. Este cuadro de diálogo verifica que los clientes realmente tienen la intención de finalizar la sesión de chat. Puede personalizar el cuadro de diálogo de confirmación, el título, el mensaje y el texto del botón.
+ Anular el mensaje de rechazo del archivo adjunto.
+ Muestra el botón **Minimizar** en el encabezado del chat.
## Configuración del objeto de personalización
En este ejemplo, se muestra cómo implementar todas las personalizaciones opcionales. Para ver una lista de todas las personalizaciones posibles, consulte [Restricciones y opciones admitidas](#customization-options-constraints). Como son opcionales, puede implementar algunos o todos los campos que se muestran en el siguiente ejemplo. Sustituya las cadenas `eventNames.customer`, `eventNames.agent`, `eventNames.supervisor`, `eventMessages.participantJoined`, `eventMessages.participantDisconnect`, `eventMessages.participantLeft`, `eventMessages.participantIdle`, `eventMessages.participantReturned` y `eventMessages.chatEnded` según sea necesario. Los iconos deben estar alojados en un entorno público URLs.
```
amazon_connect('customizationObject', {
header: {
dropdown: true,
dynamicHeader: true,
minimizeChatHeaderButton: true,
},
transcript: {
hideDisplayNames: false,
eventNames: {
customer: "{{User}}",
agent: "{{Webchat Agent}}",
supervisor: "{{Webchat Supervisor}}"
},
eventMessages: {
participantJoined: "{name} has joined the chat",
participantDisconnect: "",
participantLeft: "{name} has dropped",
participantIdle: "{name}, are you still there?",
participantReturned: "",
chatEnded: "Chat ended",
},
displayIcons: true,
iconSources: {
botMessage: "{{imageURL}}",
systemMessage: "{{imageURL}}",
agentMessage: "{{imageURL}}",
customerMessage: "{{imageURL}}",
},
},
composer: {
disableEmojiPicker: true,
disableCustomerAttachments: true,
alwaysHideToolbar: true,
hide: false,
},
footer: {
disabled:true,
skipCloseChatButton: true,
},
endChat: {
enableConfirmationDialog: true,
confirmationDialogText: {
title: "End Chat",
message: "Are you sure you want to end this chat?",
confirmButtonText: "End Chat",
cancelButtonText: "Cancel",
},
},
attachment: {
// Default rejectedErrorMessage: Attachment was rejected.
rejectedErrorMessage: "Custom Error Message: Files cannot exceed 15 MB." //this is customizable attribute
}
});
```
La siguiente imagen muestra el aspecto de las personalizaciones si usa el ejemplo:
## Restricciones y opciones admitidas
En la siguiente tabla se enumeran los nombres de personalización admitidos y las restricciones de valor recomendadas.
| Opción de diseño personalizado | Tipo | Descripción |
| --- | --- | --- |
| `header.dropdown` | Booleano | Representa el menú desplegable del encabezado en lugar del pie de página predeterminado. Si configura esta opción como `true`, aparece el botón **Descarga de transcripciones** y permanece visible hasta que establezca la opción en `false` o hasta que la elimine. |
| `header.dynamicHeader` | Booleano | Establece dinámicamente el título del encabezado como «Chatear con Bot/AgentName». |
| `header.hideTranscriptDownloadButton` | Booleano | Oculta el botón de [descarga de la transcripción](chat-widget-download-transcript.md) en el menú desplegable del encabezado. El valor predeterminado es false. |
| `header.minimizeChatHeaderButton` | Booleano | Muestra el botón Minimizar en el encabezado del chat. El valor predeterminado es false. |
| `transcript.hideDisplayNames` | Booleano | Oculta todos los nombres públicos y aplica máscaras de nombres predeterminados si no se proporcionan `eventNames`. |
| `transcript.eventNames.customer` | Cadena | Enmascara el nombre público del cliente. |
| `transcript.eventNames.agent` | Cadena | Enmascara el nombre público del agente. |
| `transcript.eventNames.supervisor` | Cadena | Enmascara el nombre público del supervisor. |
| ` transcript.eventMessages.participantJoined` | Cadena | Anula el mensaje del evento en la transcripción para cuando un participante se haya unido al chat. Si se especifica una cadena vacía, el mensaje del evento se omitirá de la transcripción. Se puede pasar `{name}` en el mensaje; se sustituirá por el nombre público del participante correspondiente. El mensaje predeterminado es `{name} has joined the chat`. |
| `transcript.eventMessages.participantDisconnect` | Cadena | Anula el mensaje del evento en la transcripción para cuando un participante se desconecta del chat. Si se especifica una cadena vacía, el mensaje del evento se omitirá de la transcripción. Se puede pasar `{name}` en el mensaje; se sustituirá por el nombre público del participante correspondiente. El mensaje predeterminado es {`name} has been idle too long, disconnecting`. |
| `transcript.eventMessages.participantLeft` | Cadena | Anula el mensaje del evento en la transcripción para cuando un participante se haya marchado del chat. Si se especifica una cadena vacía, el mensaje del evento se omitirá de la transcripción. Se puede pasar `{name}` en el mensaje; se sustituirá por el nombre público del participante correspondiente. El mensaje predeterminado es `{name} has left the chat`. |
| `transcript.eventMessages.participantIdle` | Cadena | Anula el mensaje del evento en la transcripción para cuando un participante esté inactivo. Si se especifica una cadena vacía, el mensaje del evento se omitirá de la transcripción. Se puede pasar `{name}` en el mensaje; se sustituirá por el nombre público del participante correspondiente. El mensaje predeterminado es `{name} has become idle`. |
| `transcript.eventMessages.participantReturned` | Cadena | Anula el mensaje del evento en la transcripción para cuando un participante haya vuelto al chat. Si se especifica una cadena vacía, el mensaje del evento se omitirá de la transcripción. Se puede pasar `{name} ` en el mensaje; se sustituirá por el nombre público del participante correspondiente. El mensaje predeterminado es `{name} has returned`. |
| `transcript.eventMessages.chatEnded` | Cadena | Anula el mensaje del evento en la transcripción para cuando el chat ha finalizado. Si se especifica una cadena vacía, el mensaje del evento se omitirá de la transcripción. Se puede pasar `{name}` en el mensaje; se sustituirá por el nombre público del participante correspondiente. El mensaje predeterminado es `Chat has ended!` |
| `transcript.displayIcons` | Booleano | Activa los iconos de visualización de mensajes. |
| `transcript.iconSources.botMessage` | Cadena | El icono que se muestra para los mensajes del bot debe estar alojado en una URL pública. |
| `transcript.iconSources.systemMessage` | Cadena | El icono que se muestra para el mensaje del sistema debe estar alojado en una URL pública. |
| `transcript.iconSources.agentMessage` | Cadena | El icono que se muestra para el mensaje del agente debe estar alojado en una URL pública. |
| `transcript.iconSources.customerMessage` | Cadena | El icono que se muestra para el mensaje del cliente debe estar alojado en una URL pública. |
| `composer.alwaysHideToolbar` | Booleano | Oculta la barra de herramientas de formato que incluye características de estilo de texto, como negrita, cursiva y opciones de listas numeradas y con viñetas. |
| `composer.disableEmojiPicker` | Booleano | Desactiva el selector de emojis cuando se utiliza el [editor de texto enriquecido](enable-text-formatting-chat.md). |
| `composer.disableCustomerAttachments` | Booleano | Impide que los clientes envíen o carguen archivos adjuntos. |
| `composer.hide` | Booleano | Oculta el compositor (`true`) o lo muestra (`false`). Para cambiar el compositor en función de los eventos (por ejemplo, cuando se une un agente), utilícelo `registerCallback` con el `hideComposer` método. Para obtener más información, consulte [Campos de fragmentos de widgets compatibles en Amazon Connect que se pueden personalizar](supported-snippet-fields.md).document.getElementById("amazon-connect-chat-widget-iframe").contentWindow.connect.ChatInterface.hideComposer(false) |
| `footer.disabled` | Booleano | Oculta el pie de página predeterminado y el botón **Finalizar chat**. |
| `footer.skipCloseChatButton` | Booleano | Cierra directamente el widget al hacer clic en el botón **Finalizar chat**, en lugar de mostrar el botón **Cerrar**. |
| `endChat.enableConfirmationDialog` | Booleano | Activa el cuadro de diálogo de confirmación Finalizar chat. Si no se proporciona confirmationDialogText, se utilizan los textos predeterminados. |
| `endChat.confirmationDialogText.title` | Cadena | Anula el título del cuadro de diálogo de confirmación Finalizar chat. |
| `endChat.confirmationDialogText.message` | Cadena | Anula el mensaje del cuadro de diálogo de confirmación Finalizar chat. |
| `endChat.confirmationDialogText.confirmButtonText` | Cadena | Anula el texto del botón de confirmación en el cuadro de diálogo de confirmación Finalizar chat. |
| `endChat.confirmationDialogText.cancelButtonText` | Cadena | Anula el texto del botón de cancelación en el cuadro de diálogo de confirmación Finalizar chat. |
| `attachment.rejectedErrorMessage` | Cadena | Anula el mensaje de error al rechazar los archivos adjuntos del widget de chat. |