FrHowTo create a custom Redmine theme » History » Version 1
Thomas Godard, 2013-07-25 17:38
French translation of HowTo_create_a_custom_Redmine_theme
| 1 | 1 | Thomas Godard | h1. Tutoriel de création de son propre thème personnalisé |
|---|---|---|---|
| 2 | |||
| 3 | Redmine permet la création de thème. Les thèmes peuvent suplanter les feuilles de styles (application.css) et utiliser du javascript. |
||
| 4 | |||
| 5 | h2. Créer un nouveau thème |
||
| 6 | |||
| 7 | Créez un répertoire dans @public/themes@. Le nom du répertoire sera également le nom du thème. |
||
| 8 | |||
| 9 | Example: |
||
| 10 | |||
| 11 | public/themes/mon_theme |
||
| 12 | |||
| 13 | |||
| 14 | Créez votre propre @application.css@ et enregistrez le dans le sous-répertoire nommé @stylesheets@: |
||
| 15 | |||
| 16 | public/themes/mon-theme/stylesheets/application.css |
||
| 17 | |||
| 18 | Voici un exemple de feuille de style qui suplante quelques élements de la feuille de style par défaut : |
||
| 19 | |||
| 20 | <pre><code>/* charge la feuille de style par défaut de Redmine */ |
||
| 21 | @import url(../../../stylesheets/application.css); |
||
| 22 | |||
| 23 | /* ajoute un logo dans le header */ |
||
| 24 | #header { |
||
| 25 | background: #507AAA url(../images/logo.png) no-repeat 2px; |
||
| 26 | padding-left: 86px; |
||
| 27 | } |
||
| 28 | |||
| 29 | /* bascule le menu Projet sur la droite */ |
||
| 30 | #main-menu { |
||
| 31 | left: auto; |
||
| 32 | right: 0px; |
||
| 33 | } |
||
| 34 | </code></pre> |
||
| 35 | |||
| 36 | Cet exemple suppose que vous avez une image dans @mon-theme/images/logo.png@ |
||
| 37 | |||
| 38 | Vous pouvez télécharger ce thème comme point de départ de votre propre thème. Enregistrez le dans le répertoire @public/themes@. |
||
| 39 | |||
| 40 | h2. Ajouter du javascript |
||
| 41 | |||
| 42 | Mettez simplement votre javascript dans @javascripts/theme.js@ et il sera automatiquement chargé à chaque page (Redmine >= 1.1.0 uniquement). |
||
| 43 | |||
| 44 | h2. Appliquer votre nouveau thème |
||
| 45 | |||
| 46 | Allez dans "Administration -> Configuration -> Affichage" et sélectionnez votre tou nouveau thème dans la liste déroulante "Thème". Sauvegardez votre configuration. |
||
| 47 | Redmine devrait maintenant s'afficher avec votre nouveau thème. |
||
| 48 | |||
| 49 | Si vous utilisé une version de Redmine antérieure à 1.1.0, vous devrez peut-être relancer votre application afin que votre nouveau thème s'affiche dans la liste déroulante "Thème". |