Personalização

Personalização do componente SelphID Widget.

O Widget SelphID é facilmente personalizável por meio de variáveis CSS e algumas propriedades.

---

Personalização de estilos

Os Widgets Selphi e SelphID podem ser personalizados com as seguintes variáveis CSS aplicadas à etiqueta facephi-sdk-provider. Consulte a lista completa de variáveis CSS na página de Personalização CSS do SDK Provider.

---

Configuração de textos

Os textos padrão do componente podem ser substituídos com o uso de um arquivo JSON de idioma personalizado referenciado na propriedade language no elemento SDK Provider (facephi-sdk-provider).

<facephi-sdk-provider
  language={'/i18n/custom-strings.json'}
  ...
></facephi-sdk-provider>

Se faltar alguma string, o widget não carregará nenhum texto nesse lugar.

Consulte as informações referentes à configuração de literais, incluindo os modelos de tradução padrão, na seção de personalização do SDK Web.

---

Personalização de recursos gráficos

As animações utilizadas no Widget SelphID podem ser substituídas pelo uso das propriedades logo, loadingAnimation e tutorialAnimations.

Para as animações, é recomendável utilizar a propriedade customAnimations do sdk provider.

// Exemplo em JSX
<facephi-selphid-widget
  logo={'/assets/images/logo.png'}
  loadingAnimation={'/assets/images/loading.gif'}
  tutorialAnimations={ ["/assets/images/tutorial1.gif", "/assets/images/tutorial2.gif", "/assets/images/tutorial3.gif"] }
  ...
></facephi-selphid-widget>

Observação: Configure --wrapper-display-logo a "block" para mostrar o logo na seção superior do widget.

Observação: O valor de tutorialAnimations deve estar em formato de array de strings (string[]). Use JSX, variáveis do seu framework ou lógica de JavaScript para implementar seu valor.

---