As traduções são geradas por tradução automática. Em caso de conflito entre o conteúdo da tradução e da versão original em inglês, a versão em inglês prevalecerá.
# Personalizações adicionais para seu widget de chamadas pela web do Amazon Connect
Você pode adicionar as seguintes personalizações ao widget de chamadas pela web:
+ Aplique [desfoque de fundo](#background-blur) ao bloco de vídeo do seu cliente.
+ Defina o widget como [tela cheia](#fullscreen-mode).
+ Selecione o [dispositivo de câmera padrão](#choose-default-camera).
+ [Redimensione o vídeo](#resize-video) para caber em seu contêiner.
As seções a seguir explicam os detalhes das personalizações, os casos de uso e como configurá-las. Para gerenciar essas personalizações, configure `WebCallingCustomizationObject`.
**Topics**
+ [Desfoque de plano de fundo](#background-blur)
+ [Modo de tela cheia](#fullscreen-mode)
+ [Escolher o dispositivo de câmera padrão](#choose-default-camera)
+ [Redimensionar vídeo](#resize-video)
+ [Configurar o objeto de personalização](#configure-customization-object-web)
+ [Restrições e opções com suporte](#supported-options-web-calling)
## Desfoque de plano de fundo
Essa personalização controla o comportamento de desfoque de fundo do vídeo do cliente. Quando habilitado, o fundo do cliente fica desfocado quando o vídeo está ativo. Isso ajuda a proteger as informações pessoais ou espaços privados que podem estar visíveis em segundo plano durante a videochamada.
Para habilitar o desfoque de fundo, defina `videoFilter.backgroundBlur.option` como `ENABLED_ON_BY_DEFAULT` em `WebCallingCustomizationObject`.
## Modo de tela cheia
Use essa personalização para controlar o comportamento de tela cheia do widget. Você pode habilitar a tela cheia de duas maneiras:
+ Adicione um botão de tela cheia ao widget. O cliente pode usar o botão para ativar e desativar a tela cheia.
Para adicionar um botão de tela cheia, defina `fullscreen.displayButton` como `ENABLED`.
OU
+ Defina o widget como tela cheia ao carregar.
Para habilitar a tela cheia durante o carregamento, defina `fullscreen.fullscreenOnLoad` como `ENABLED`.
É particularmente útil usar o modo de tela cheia quando o cliente precisa se concentrar no widget, por exemplo, durante o compartilhamento de tela.
Você pode usar essas duas opções individualmente ou juntas.
## Escolher o dispositivo de câmera padrão
Essa personalização permite que o widget selecione o dispositivo de câmera padrão quando o cliente habilita o vídeo, oferecendo opções para câmera frontal ou traseira. Essa capacidade é útil para diagnosticar dispositivos remotamente, por exemplo. O cliente pode usar a câmera traseira para mostrar o aparelho ao atendente.
Para selecionar a câmera traseira como padrão, defina `devices.defaultCamera` como `Back`.
## Redimensionar vídeo
Essa personalização controla como os blocos de vídeo do cliente e do atendente são redimensionados no widget. Por exemplo, o quadro de vídeo pode ser redimensionado para preencher todo o bloco ou dimensionado para caber no quadro de vídeo, deixando espaços vazios se a proporção do quadro de não corresponder ao bloco de vídeo.
+ Para redimensionar o vídeo para o cliente, defina `videoTile.localVideoObjectFit` como o valor pretendido.
+ Para redimensionar o vídeo para o atendente, defina `videoTile.remoteVideoObjectFit` como o valor pretendido.
Para obter mais informações, consulte [Restrições e opções com suporte](#supported-options-web-calling).
## Configurar o objeto de personalização
Este exemplo mostra como implementar personalizações opcionais para chamada pela web. Para ver uma descrição detalhada dessas opções, consulte [Restrições e opções com suporte](#supported-options-web-calling).
É possível implementar alguns ou todos os campos mostrados no exemplo a seguir. Quando você não implementa personalizações, os comportamentos padrão são usados para os campos ausentes.
```
amazon_connect('webCallingCustomizationObject', {
videoFilter: {
backgroundBlur: {
option: "ENABLED_OFF_BY_DEFAULT"
}
},
fullscreen: {
displayButton: "ENABLED",
fullscreenOnLoad: "DISABLED"
},
devices: {
defaultCamera: "Front"
},
videoTile: {
localVideoObjectFit: "cover",
remoteVideoObjectFit: "cover"
},
copyDisplayNameFromAuthenticatedChat: true
});
```
A imagem a seguir mostra a aparência das personalizações quando o modo de tela cheia não está ativado.
A imagem a seguir mostra a aparência das personalizações no modo de tela cheia.
## Restrições e opções com suporte
A tabela a seguir lista os campos de personalização compatíveis e as restrições de valores recomendadas.
| Opção de layout personalizado | Tipo | Valores | Description |
| --- | --- | --- | --- |
| `videoFilter.backgroundBlur.option` | string | `ENABLED_ON_BY_DEFAULT` \| `ENABLED_OFF_BY_DEFAULT` | Define o desfoque do fundo do bloco de vídeo do seu cliente. Por padrão, quando seu cliente habilita o vídeo, o filtro de desfoque de fundo é aplicado ao bloco de vídeo. Se você não quiser habilitar o filtro por padrão, poderá defini-lo como `ENABLED_OFF_BY_DEFAULT`. Seu cliente ainda poderá habilitar manualmente o filtro na página de preferências do widget. |
| `fullscreen.displayButton` | string | `ENABLED` | Adiciona um botão ao canto superior direito do widget para que ele fique em tela cheia no navegador. Por padrão, esse botão não será adicionado ao widget. Se você quiser adicioná-lo, poderá defini-lo como `ENABLED`. |
| `fullscreen.fullscreenOnLoad` | string | `ENABLED` | Torna o widget em tela cheia no navegador. Por padrão, o widget será ancorado no canto inferior direito da página da web. Defini–lo como `ENABLED` vai fazer com que o widget fique em tela cheia no navegador. |
| `devices.defaultCamera` | string | `Front` \| `Back` | Define o dispositivo de câmera padrão quando seu cliente habilita o vídeo. Isso se destina aos casos de uso de dispositivos móveis ou tablets. Por padrão, a câmera padrão é selecionada ([detalhe](https://developer.mozilla.org/en-US/docs/Web/API/MediaDevices/enumerateDevices)). (Para obter mais informações, consulte o [métodoMediaDevices: enumerateDevices ()](https://developer.mozilla.org/en-US/docs/Web/API/MediaDevices/enumerateDevices) na documentação para desenvolvedores da Mozilla.) Quando você a define como `Front\|Back`, ela seleciona a câmera correspondente, se disponível. |
| `copyDisplayNameFromAuthenticatedChat` | booleano | `true` \| `false` | Caso o cliente final seja autenticado usando o bloco de fluxo [Autenticar Cliente](authenticate-customer.md), definir o valor como `true` copiará o nome de exibição para o contato de voz. O padrão é `false`. |
| `videoTile.localVideoObjectFit` | string | `fill` \| `contain` \| `cover` \| `none` \| `scale-down` | Define a propriedade [object-fit](https://developer.mozilla.org/en-US/docs/Web/CSS/object-fit) do bloco de vídeo do seu cliente no widget. Por padrão, o valor é determinado pela largura e altura da resolução do vídeo: se a altura for maior que a largura, será `contain`, caso contrário, será `cover`. Para ver uma descrição detalhada de cada valor, consulte [object-fit](https://developer.mozilla.org/en-US/docs/Web/CSS/object-fit) na documentação do desenvolvedor da Mozilla. Esse atributo é aplicado somente à altura e largura de exibição do vídeo do cliente no widget. A altura e a largura do vídeo do cliente enviado ao atendente permanecem inalteradas. |
| `videoTile.remoteVideoObjectFit` | string | `fill` \| `contain` \| `cover` \| `none` \| `scale-down` | Define a propriedade [object-fit](https://developer.mozilla.org/en-US/docs/Web/CSS/object-fit) do bloco de vídeo do seu cliente no widget. Por padrão, o valor é determinado pela largura e altura da resolução do vídeo: se a altura for maior que a largura, será `contain`, caso contrário, será `cover`. Para ver uma descrição detalhada de cada valor, consulte [object-fit](https://developer.mozilla.org/en-US/docs/Web/CSS/object-fit) na documentação do desenvolvedor da Mozilla. Esse atributo é aplicado somente à altura e largura de exibição do vídeo do atendente no widget. |