utilisation d’un thème Web Azure AD UX dans services de fédération Active Directory (AD FS)

Actuellement, la connexion AD FS Forms ne reflète pas l’expérience de connexion Azure/O365. Pour fournir une expérience plus uniforme et homogène aux utilisateurs finaux, nous avons publié le thème Web suivant de feuille de style en cascade qui peut être appliqué à vos serveurs AD FS. à l’heure actuelle, la connexion de formulaires pour AD FS sur Windows Server 2016 ressemble à ceci :

Current sign-in

avec la nouvelle feuille de style, l’expérience utilisateur ressemblera davantage aux expériences de connexion Azure et Office 365.

Télécharger la feuille de style CSS

Vous pouvez télécharger le thème Web à partir de l' emplacementGitHub suivant.

Activation du nouveau thème Web

Pour activer le nouveau thème Web, procédez comme suit :

pour activer le nouveau thème web Azure AD UX dans AD FS

  1. Démarrer PowerShell en tant qu’administrateur
  2. Créer un nouveau thème Web à l’aide de PowerShell : New-AdfsWebTheme –Name custom –StyleSheet @{path="c:\NewTheme.css"}
  3. Définir le nouveau thème comme thème actif à l’aide de PowerShell : Set-AdfsWebConfig -ActiveThemeName customSet-AdfsWebConfig -ActiveThemeName custom
  4. Testez la connexion en accédant à https:// < AD FS Name. Domain > /ADFS/LS/idpinitiatedsignon.htm <

! OBSERVE Vous devez vous assurer que idpinitiatedsignon a été activé. Elle n’est pas activée par défaut. Pour activer idpinitiatedsignon, utilisez la commande PowerShell suivante : Set-AdfsProperties –EnableIdpInitiatedSignonPage $True

Image Recommandations

l’activation de l’interface utilisateur centrée vous permet d’utiliser les mêmes images pour l’arrière-plan et le logo que vous possédez peut-être déjà pour la personnalisation de Azure Active Directory entreprise. En règle générale, les mêmes recommandations en matière de taille, de ratio et de format s’appliquent.

Description Contraintes Recommandations
Le logo s’affiche en haut du panneau de connexion. JPG ou PNG transparent
Hauteur max. : 36 px
Largeur max. : 245 px
Utilisez le logo de votre organisation ici.
Utilisez une image transparente. Ne partez pas du principe que l’arrière-plan sera blanc.
N’ajoutez pas de marge intérieure autour de votre logo dans l’image, sinon le logo s’affichera disproportionnellement petit.

Arrière-plan

Description Contraintes Recommandations
Cette option s’affiche dans l’arrière-plan de la page de connexion. L’image est ancrée au centre de l’espace visible, mise à l’échelle et rognée pour remplir la fenêtre du navigateur.
Sur les écrans étroits tels que les téléphones mobiles, l’image n’est pas affichée.
Un masque noir avec une opacité de 0,55 sera appliqué sur cette image lors du chargement de la page.
JPG ou PNG
Dimensions de l’image : 1 920 x 1 080 px
Taille de fichier : < 300 Ko

Utilisez des images lorsqu’il n’y a pas de focalisation forte sur l’objet. Le formulaire de connexion opaque apparaît au centre de cette image et peut couvrir une partie de l’image en fonction de la taille de la fenêtre du navigateur.
Conservez la taille du fichier aussi réduite que possible pour garantir des temps de chargement rapides.

Étapes suivantes