Personnalisation de l'interface utilisateur

La procédure de personnalisation d'IBM® Connections est la même pour chaque application. Vous devez éditer une copie du fichier source pertinent et la sauvegarder dans le répertoire de personnalisation correspondant.

Avant de commencer

Révisez l'interface utilisateur pour déterminer ce que vous souhaitez personnaliser.

Pourquoi et quand exécuter cette tâche

Utilisez ces instructions comme guide général pour la personnalisation de l'interface utilisateur. Pour plus d'information sur la personnalisation des composants spécifiques de l'interface utilisateur, reportez-vous aux liens connexes. Pour obtenir des conseils sur la personnalisation de votre déploiement, voir Pratiques recommandées de personnalisation.

Le style de l'interface utilisateur d'IBM Connections est basé sur IBM Collaboration Solutions OneUI Toolkit 3.0.

Procédure

  1. Recherchez le fichier constituant la source des éléments d'interface que vous souhaitez personnaliser. Pour obtenir la liste des répertoires source d'application Web et des bundles OSGi qui sont fournis avec IBM Connections, reportez-vous à la rubrique Fichiers WAR d'application et bundles OSGi.
  2. Activez la fonction de débogage de personnalisation. Pour plus d'informations, voir Activation du mode édition de personnalisation de l'interface utilisateur.
  3. Copiez le fichier que vous souhaitez personnaliser et collez-le dans le répertoire de personnalisation approprié. Pour plus d'informations, voir Détermination de l'emplacement de sauvegarde de vos personnalisations.
    A faire : Vous trouverez les sources des feuilles de style dans les fichiers JAR suivants :
    RACINE_WAS/profiles/nom_profil/installedApps/nom_cellule/nom_application.ear/nom_application.war/WEB-INF/eclipse/plugins/com.ibm.oneui3.styles_version.jar
    Remarques :
    • Le fichier com.ibm.lconn.oneui3.styles_version.jar contient le kit d'outils IBM Collaboration Solutions OneUI 3.0.x qui inclut des ressources image et sprites.
    • Le fichier JAR contient les fichiers CSS de toutes les applications IBM Connections.
    RACINE_WAS/profiles/nom_profil/installedApps/nom_cellule/nom_application.ear/nom_application.war/WEB-INF/eclipse/plugins/com.ibm.lconn.core.styles_version.jar
    Remarque : Le fichier com.ibm.lconn.core.styles_version.jar contient les feuilles de style CSS qui étendent ou substituent les styles par défaut du kit d'outil OneUI 3.0.x.
    où :
    • RACINE_WAS est le répertoire où IBM WebSphere Application Server est installé.
    • nom_profil est le profil où vous avez installé IBM Connections.
    • nom_cellule est la cellule où vous avez installé l'application.
    • nom_application.ear est le nom du fichier EAR de l'application. Pour personnaliser les styles d'interface communs à toutes les applications, utilisez le fichier Common.ear.
    • nom_application.war est le nom du fichier WAR de l'application.
      Conseil : Pour obtenir la liste des répertoires source d'application qui sont fournis avec IBM Connections, reportez-vous à la rubrique Fichiers WAR d'application et bundles OSGi.
    • version est le numéro de version de l'édition d'IBM Connections suivi de la date et du numéro de version du fichier JAR.
    Remarque : Dans les éditions précédentes d'IBM Connections, les feuilles de style par défaut se trouvaient dans le sous-répertoire nav du répertoire RACINE_WAS/profiles/nom_profil/installedApps/nom_cellule/nom_application.ear/nom_application.war. Cet emplacement n'existe plus dans cette édition.

    Le tableau suivant identifie les fichiers source de chaque zone de l'interface utilisateur.

    Tableau 1. Zones de personnalisation courantes
    Fonction Emplacement de fichier
    Feuilles de style en cascade
    • Pour ajouter des styles personnalisés au produit, modifiez les fichiers suivants:
      Remarque : Si les utilisateurs affichent le produit en arabe, en hébreu ou dans une autre langue dont la lecture s'effectue de droite à gauche, copiez également le fichier defaultTheme_rtl.css.
      • /nav/common/styles/defaultTheme/custom.css
      • /nav/common/styles/defaultTheme/custom_rtl.css
      Pour plus d'informations, voir Ajout de styles à la feuille de style IBM Connections.
    • Pour apporter des modifications étendues aux couleurs utilisées dans le produit, éditez le fichier suivant :
      /nav/common/styles/defaultTheme/defaultTheme.css

      Pour plus d'informations, voir Modifications étendues de la couleur et du style.

    Page d'erreur /nav/templates/error.jsp

    Pour plus d'informations, voir Personnalisation de la page d'erreur.

    Pied de page /nav/templates/footer.jsp

    Pour plus d'informations, voir Personnalisation du pied de page.

    Page de connexion /nav/templates/login.jsp

    Pour plus d'informations, voir Personnalisation de la page de connexion.

    Barre de navigation /nav/templates/header.jsp
    Vous trouverez les menus accessibles à partir de la barre de navigation :
    /nav/templates/menu/people.jsp
    /nav/templates/menu/communities.jsp
    /nav/templates/menu/apps.jsp
    Pour plus d'informations, voir Personnalisation de la barre de navigation.
    Par exemple :
    • Pour modifier le pied de page et obtenir l'affichage du même pied de page dans toutes les applications, enregistrez le fichier du pied de page mis à jour dans le répertoire suivant :

      rép_personnalisation/common/nav/templates/footer.jsp

    • Pour modifier la page de connexion d'une application unique, enregistrez le fichier de la page de connexion mise à jour dans le répertoire dans lequel sont enregistrées les personnalisations spécifiques de cette application. Par exemple, pour modifier la page de connexion de l'application Fichiers uniquement, enregistrez le fichier login.jsp dans le sous-répertoire files et non dans le sous-répertoire common :

      rép_personnalisation/files/nav/templates/login.jsp

  4. Effectuez vos modifications dans le fichier situé dans le répertoire customizationDir.
  5. Testez vos modifications en régénérant le navigateur Web. Il sera probablement nécessaire d'effacer le cache de votre navigateur pour voir les modifications.
  6. Lorsque vous êtes prêt à publier vos modifications, désactivez la fonction de débogage de personnalisation.
  7. A l'aide de WebSphere Application Server Integrated Solutions Console, arrêtez et redémarrez chaque fichier EAR d'application.
  8. Forcez la régénération de tous les navigateurs Web des utilisateurs afin d'actualiser tous les contenus mis en cache et d'afficher vos modifications en exécutant la commande de mise à jour de l'horodatage de la version de produit. Pour plus d'informations, voir Etape post-personnalisation requise.

Que faire ensuite

Pour plus d'informations sur la personnalisations des zones spécifiques du produit, reportez-vous aux rubriques associées.