Creazione di una pagina di accesso hosted

Creare una pagina di accesso in hosting in IAM per personalizzare l'aspetto dell'esperienza di accesso al dominio di Identity utilizzando le classi di stile, il codice HTML personalizzato e il supporto della traduzione.

  1. Aprire il menu di navigazione e selezionare Identità e sicurezza. In Identità selezionare Domini.
  2. Selezionare il nome del dominio di Identity in cui si desidera lavorare. Potrebbe essere necessario modificare il compartimento per trovare il dominio desiderato,
  3. Nella pagina dei dettagli del dominio selezionare Impostazioni.
  4. Nella pagina Impostazioni selezionare Accesso in hosting.
  5. Selezionare Abilita connessione hosted.
  6. Modificare il HTML personalizzato.
    È disponibile un set limitato di tag HTML.
    • div
    • Immagine
    • etichetta
    • input
    • h1
    • h2
    • h3
    • intervallo
    È disponibile un set limitato di proprietà di stile.
    • allinea elementi:
    • background-color:
    • sfondo:
    • raggio bordo:
    • bordo:
    • box-shadow:
    • contenuto:
    • visualizzazione:
    • altezza:
    • contenuto giustificato:
    • a sinistra:
    • margine superiore:
    • margine:
    • altezza massima:
    • larghezza massima:
    • altezza minima:
    • imbottitura a sinistra:
    • padding-right:
    • riempimento:
    • position:
    • text-align:
    • superiore:
    • larghezza:

    Le proprietà possono essere applicate in linea. Nell'esempio seguente, lo sfondo della pagina di accesso è stato personalizzato impostando la proprietà style su style="background-color:lightblue"

    <div class="oj-flex oj-sm-flex-direction-column">
      <div id="idcs-app-shell-signin-background" class="oj-idaas-signin-app-shell oj-idaas-signin-app-shell-background">
        <div class="oj-flex oj-idaas-signin-app-shell-wrapper oj-idaas-signin-app-shell-wrapper-background" style="background-color:lightblue">
          <div class="oj-flex-item oj-sm-12 oj-idaas-signin-app-shell-padding-left oj-idaas-signin-app-shell-padding-right">
            <div class="oj-idaas-signin-app-shell-branding-logo-wrapper">
              <img id="custom-idaas-signin-branding-logo" class="oj-idaas-signin-app-shell-branding-logo" />
            </div>
            <oj-idaas-signin-section id="custom-idaas-signin-section"></oj-idaas-signin-section>
          </div>
          <div class="oj-flex-item oj-sm-12 oj-idaas-signin-app-shell-content-wrapper">
            <oj-idaas-signin-message id="custom-idaas-signin-message"></oj-idaas-signin-message>
            <div class="oj-idaas-signin-app-shell-padding-left oj-idaas-signin-app-shell-padding-right">
              <oj-bind-slot name="content"></oj-bind-slot>
            </div>
          </div>
        </div>
      </div>
    </div>
    Suggerimento

    È necessario ricominciare? È possibile ripristinare i valori HTML predefiniti selezionando Ripristina HTML predefinito.
  7. Specificare le traduzioni.
    Nella pagina di connessione è possibile personalizzare gli elementi esistenti riportati di seguito. Per personalizzare gli elementi esistenti, è necessario utilizzare i seguenti ID riserva.
    • Elemento: username label
    • ID prenotazione: idcs-username-label
    • Elemento: username placeholder (testo della Guida all'interno del campo del nome utente)
    • ID prenotazione: idcs-username-placeholder
    • Elemento: password label
    • ID prenotazione: idcs-password-label
    • Elemento: password placeholder (testo della Guida all'interno del campo del nome utente)
    • ID prenotazione: idcs-password-placeholder
    Suggerimento

    È necessario ricominciare? È possibile cancellare il riquadro delle traduzioni selezionando Ripristina traduzioni predefinite.
  8. Selezionare Anteprima accesso per visualizzare le modifiche senza salvarle.
  9. Selezionare Salva modifiche.