Modifier l’apparence de Outlook Web App

Pour consulter la première partie : Comment personnaliser Outlook Web App avec Exchange 2010 SP1.

Les raisons amenant à modifier l’apparence graphique du webmail d’une entreprise peuvent être très variées. Cela peut être une volonté simplement cosmétique pour intégrer l’application web au style du portail web de l’entreprise. C’est aussi parfois une demande de la part du responsable sécurité d’une société pour permettre aux utilisateurs d’identifier rapidement qu’ils sont sur le bon site web et qu’ils ne sont pas en train d’être victimes d’une redirection vers un site malicieux.

OWA étant une application Web en tant que telle, il est possible et supporté de modifier un grand nombre de paramètres. Voici les quelques modifications que nous allons faire dans la suite de cet article :

• Modification de la page de logon
• Modification d’un thème dans OWA
• Publication d’un thème à tous les utilisateurs de l’entreprise

Modification de la page de logon

La page de logon est en fait une page ASPX qui assemble les ressources suivantes :

• des images pour l’entourage de la page
• des feuilles de style pour les fontes ou les couleurs des caractères
• des dll de ressources pour le texte affiché

Les images ainsi que les feuilles de style de la page de logon sont stockées dans le répertoire commun à toute l’application web suivant :

Exchange Server\V14\ClientAccess\Owa\\themes\resources

(Avec Exchange 2010 SP1 le répertoire porte le numéro de version 14.1.218.13)
 

Le nom des images de la page de logon est construit de la façon suivante : voir figure 1.

Lgn + position haut ou bas + position gauche ou droite.gif

Ce qui donne par exemple lgntopl.gif pour le rectangle en haut à gauche de la page de logon.

Ci-dessous la page de logon décomposée avec les noms des images utilisées.

Le texte de la page de logon est quant à lui affiché à partir de DLL de ressources qui sont stockées dans les répertoires suivants dépendant de la langue utilisée par le navigateur.

\Exchange Server\V14\ClientAccess\Owa\Bin\

Il n’est pas supporté d’effectuer des modifications dans ces DLLs.

Le formatage de la page de logon est par contre appliqué par la feuille de style logon.css que vous pouvez modifier.

Par exemple, modifions la couleur du texte d’avertissement. Depuis IE, lancez les outils pour le développeur avec la touche F12. De là, vous allez pouvoir sélectionner le champ ou la zone de la page pour laquelle le contenu de la feuille de style vous intéresse. Voir figure 2.

Il suffit de regarder dans la colonne en bas à droite, la ligne de style qui nous intéresse. Dans le cas de notre exemple, il faut chercher une ligne « color » qui n’est pas rayée et pour vérifier, vous pouvez directement modifier la valeur, la couleur du texte changera automatiquement dans la page.

Il reste à reporter la modification dans le fichier logon.css dans le répertoire \themes \ressources.

Une fois la modification effectuée, pensez à rafraîchir le cache du navigateur au chargement de la page (Ctrl + F5) pour que la nouvelle feuille de style et les nouvelles images soient prises en compte.

Nous avons personnalisé notre page de logon, voici un exemple du résultat obtenu. Voir figure 3.

Après avoir personnalisé notre page de logon, nous allons pouvoir procéder à la création d’un thème pour OWA.