Si vous utilisiez un thème personnalisé dans une édition antérieure à la version
7.5.1, ce thème risque de ne pas fonctionner comme prévu dans la version 7.5.1 ou une version ultérieure.
Si vous procédez à une mise à niveau vers la version 7.5.1 ou une version postérieure, vous devez éditer
et restaurer le thème personnalisé pour pouvoir l'utiliser.
Avant de commencer
Dans l'édition précédente de
IBM® Rational Asset Manager,
un thème personnalisé doit exister. Pour créer un thème de ce type,
exécutez la procédure décrite dans
Modification de l'apparence du site à l'aide de thèmes.
Enregistrez le thème personnalisé :
- Cliquez sur .
- Dans la section Gestion du thème, cliquez sur Télécharger le thème
actuel. Vous êtes invité à ouvrir ou à enregistrer un fichier compressé.
- Enregistrez le fichier et renommez-le afin de l'identifier en tant que version
personnalisée.
Pourquoi et quand exécuter cette tâche
Dans
Rational Asset Manager version
7.5.1, le fichier
header.jspf est mis à jour pour afficher
le nom de l'utilisateur connecté, les liens Connexion et Déconnexion, le menu Aide et les options de menu. Si vous téléchargez un thème d'une version précédente, ces éléments
ainsi que les options de menu Sommaire de l'aide, Extensions et Informations produit - Rational Asset Manager
ne sont pas visibles dans la bannière. Pour les afficher, vous devez
copier des lignes HTML et JavaScript supplémentaires dans le fichier
header.jspf.
Procédure
- Mettez à niveau Rational Asset Manager. Le thème par défaut de l'édition est appliqué.
- Facultatif : Téléchargez le thème
par défaut de la version de Rational Asset Manager mise à niveau afin
de pouvoir comparer les thèmes :
- Cliquez sur .
- Dans la section Gestion du thème, cliquez sur Télécharger le thème
actuel. Vous êtes invité à ouvrir ou à enregistrer un fichier compressé.
- Enregistrez le fichier et renommez-le pour l'identifier en tant que version
par défaut.
- Extrayez les fichiers compressés.
- Dans le fichier qui contient la version personnalisée du thème,
ouvrez le fichier header.jspf dans un éditeur de texte.
- Copiez les lignes de HTML et de JavaScript suivantes et collez-les
dans le fichier header.jspf à un endroit logique
pour votre thème personnalisé. Si vous avez téléchargé
le thème par défaut, vous pouvez comparer vos modifications avec la structure
figurant dans le fichier header.jspf par défaut.
<h:panelGroup id="signin" rendered="#{!loginUser.user.registered}">
<h:outputLink id="loginURL" value="#{loginUser.loginAction}">
<h:outputText id="loginUid" value="#{loginUser.loginMsg}" />
</h:outputLink>
</h:panelGroup>
<h:panelGroup id="signout" rendered="#{loginUser.user.registered}">
<h:outputText id="welcomeUser" value="#{loginUser.welcomeMsg}" escape="false"/>
<h:outputText id="welcomeSeparator" value="|" />
<h:outputLink id="logoutLnk" value="javascript:logout();">
<h:outputText id="uidnotWAS" styleClass="signInOutText" value="#{loginUser.loginMsg}" />
</h:outputLink>
</h:panelGroup>
<a href="#" title="${bundle.navigation_help}" id="help_menu" class="jazz-ui-MenuPopup">
<span class="sprite-image help-menu"></span>
<img class="caret" src="${pageContext.request.contextPath}/javascript/dojo/jazz/ui/graphics/Toolbar/white-caret.gif" />
</a>
<script type="text/javascript">
dojo.addOnLoad(function() {
var helpMenu = new jazz.ui.MenuPopup({align: "right", cacheMenu: true},'help_menu'); //options,elementID
helpMenu.menuProvider = function() {
var menu = new jazz.app._ComponentMenu();
menu.addItemByArgs({label: "${bundle.navigation_help_content}", icon: dojo.moduleUrl("jazz.ui","graphics/PageTemplate/icons/systemhelp.gif"), onClick: function() {window.open("${applicationScope.docPath}/index.jsp")} });
menu.addItemByArgs({label: "${bundle.navigation_extensions}", icon: dojo.moduleUrl("ram","graphics/content/icons/extensions_obj.gif"), href: "${pageContext.request.contextPath}/extensions.jsp"});
menu.addItemByArgs({label: "${bundle.navigation_about}", icon: dojo.moduleUrl("ram","graphics/content/icons/ram_obj.gif"), onClick: showAboutDialog });
return menu;
};
);
</script>
- Créez des feuilles de style personnalisées pour votre thème pour remplacer les styles par défaut.
- Créez un ou plusieurs fichiers CSS et enregistrez-les dans le répertoire theme/custom/css.
- Examinez les feuilles de style par défaut installée avec
Rational Asset Manager.
Pour tous les styles que vous voulez modifier, copiez les règles de style dans votre fichier CSS et éditez les styles. Les modifications effectuées dans les nouveaux fichiers CSS remplacement les règles de style des feuilles de style par défaut.
Important : Ne modifiez pas les feuilles de style par défaut dans le fichier archive de thème. Elles changent d'une version à l'autre et sont remplacées
lors de la mise à niveau de Rational Asset Manager.
- Copiez le fichier cssIncludes.jspf dans le répertoire theme/custom de votre archive de thème. Ce fichier .jspf est nécessaire pour utiliser des feuilles de style personnalisées dans la version 7.5.1
à la place des feuilles de style par défaut.
- Ajoutez vos feuilles de style personnalisées à theme/custom/cssIncludes.jspf sous forme de liens. Exemple :
<link rel="stylesheet"
type="text/css" href="${pageContext.request.contextPath}/${applicationScope.themePath}/custom/css/jkeEnterprises.css"
/>
- Créez un dossier images dans le répertoire personnalisé
et enregistrez-y les fichiers image utilisés dans votre thème. Exemple : theme/custom/images-jke-enterprises
- Compressez le thème dans un fichier archive.
- Dans la section Gestion du thème de la page Outils, cliquez sur Parcourir.
- Sélectionnez le fichier archive personnalisé.
- Cliquez sur Télécharger.
Que faire ensuite
De nombreuses feuilles de style pour la bannière ont été supprimées de
l'archive du thème. Vous pouvez consulter les règles de style par défaut dans le fichier
PageTemplate.css
et créer votre propre feuille de style pour remplacer ces styles. L'emplacement
par défaut du fichier
PageTemplate.css est le suivant :
serveur/ram/javascript/dojo/jazz/ui/templates/PageTemplate.css.