Hoe maak je een anangepast Redmine-thema.

Het voordeel van een aangepast thema is dat het uniek is en het ontwerp precies is zoals je het wilt (dit voordeel is niet beschikbaar bij de meeste standaardthema's). Je hebt de flexibiliteit om een ​​aangepast thema op elke gewenste manier te ontwerpen. Hoewel je vytvořen aangepast thema meer moeite kan kosten in vergelijking met het gebruik van een standaardthema, a to absoluut de absoluut de moeite waard. Lees verder om te leren hoe je een aangepast Redmine-thema kunt maken.

Creëren van een nový Redmine-thema

Redmine biedt fundamentele ondersteuning pro thema's. Deze thema's kunnen een paar aangepaste javascripts toevoegen en stijlbladen (application.css) overschrijven.
De eerste stap is het creëren van een new map in public/themes. De naam van de map wordt gebruikt als de naam van het thema. Bijvoorbeeld: public /themes / my_theme.
Maak vervolgens een aangepaste application.css en sla deze op in een submap genaamd stylesheets:
Veřejné / témata / my_theme / styly / application.css
Hieronder staat een voorbeeld van een aangepast stijlblad dat slechts een paar instellingen overschrijft:
/* laad het standaard Redmine-stijlblad */
@import url (../../../ styly / application.css);
/* logo voeg een v záhlaví */
#záhlaví {
    pozadí: # 507AAA url (../ images / logo.png) bez opakování 2px;
    padding-left: 86px;
}
/* verplaats het projectmenu naar rechts */
#hlavní menu {
    vlevo: auto;
    doprava: 0px;
}
Het eerder genoemde voorbeeld gaat ervan uit dat je een afbeelding hebt die zich bevindt in my_theme / images / logo.png.
Je kunt dit thema (voorbeeld) downloaden als startpunt voor je eigen aangepaste Redmine-thema. Pak použijte téma na mapě veřejných/témat.

Toepassen van aangepaste Javascript

Voeg gewoon je javascriptový prst v javascriptu /theme.js en het wordt automaticky geladen op elke page.

Instellen van Favicon

Voeg je favicon toe in de favicon map en het wordt automatisch geladen in plaats van de de standaard favicon op elke pagina. Nejlépe můžete použít favicon. (Na této stránce je favicon a malá ikona 16x16 pixelů, která je součástí vaší značky na webových stránkách.

Toepassen van het aangepaste téma

• Krok 1:

De eerste stap is het downloaded van een new thema.

• Krok 2:

Pak použijte téma v ../public/themes/. Výsledek je zobrazován pomocí mapového bloku na aplikaci.css zijn, zoals

../public/themes/redminecrm/stylesheets/application.css

• Krok 3:

Ga naar Beheer -> Instellingen en selecteer het themate that is zojuist hebt hebt aaktuit de "Thema"-lijst (keuzelijst). Sla vervolgens je instellingen op.
Op dit punt zou Redmine nu moeten worden weergegeven met je aangepaste thema.

Als je gebruik maakt van Redmine < 1.1.0, moet is mogelijk de toepassing opnieuw starten zodat deze verschijnt in de beschikbare themalijst.

Structuur van het thema's directory

Toto je nejlepší téma:

• javascripts/theme.js (volitelně): aangepaste JavaScript pro téma
• favicon / (volitelně): favicon veor het Redmine-thema
• styly / application.css (noodzakelijk): CSS (Cascading Style Sheets) pro téma

Dit wordt hieronder gedemonstreerd:
veřejnost/
  + - témata /
       +- /
            |
            + - favicon /
            | +- (bijv. favicon.ico, favicon.png)
            |
            + - javascripty /
            | + - theme.js
            |
            + - styly /
                 + - application.css

Een Redmine-thema made door het standaardthema te gebruiken

Je dobré používat téma Redmine, které je kleuren, v nejlepším CSS stylu a ve standardním tématu.

Stel je alles van een blauw thema naar een rood thema wilt veranderen. To je to, co jste udělali s onderstaande CSS.

1. sh# cd / pad / naar / redmine
2. sh # mkdir -p public / themes / redtheme / stylesheets
3. sh# vi public / themes / redtheme / stylesheets / application.css (kódování wordt hieronder weergegeven)
4. Ga naar de beheerinstellingen a selecteer vervolgens redtheme

/* laad de standaard Redmine stylesheet */

@import url (../../../ styly / application.css);

# top-menu {background: RGB (128,0,0);}

#header {background-color: RGB (192,0,0);}

# projects-index ul.projects div.root a.project {color: RGB (128,0,0); }

obsah h1, h2, h3, h4 {barva: RGB (128,0,0);}

#main {color: RGB (128,0,0); }

a, a: link, a: navštíveno {color: RGB (128,0,0); }

a: hover, a: active {color: RGB (128,0,0); }

Hoe verander je het logo van het thema?

2^e STAP

Vervang het bestand logo.png door het nouwe logobestand met een grootte van 43x30

...

#header> h1 {

               achtergrond: url(../images/logo.png) no-repeat 10px 20%;

               odsazení: 5px 60px; /* Pas dit aan om uw eigen logo in te stellen */

}