Hoe mak je een aangepast 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 het maken van een aangepast thema meer moeite kan kosten in vergelijking met het gebruik van een standaardthema, zijn de resultaten absoluut de moeite waard. Lees verder om te leren hoe je een aangepast Redmine-thema kunt maken.

Creëren van eenuw Redmine-thema

Redmine biedt fundamentele ondersteuning voor 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 nieuwe térkép nyilvános/témákban. De naam van de map wordt gebruikt als de naam van het thema. Bijvoorbeeld: nyilvános /themes / my_theme.
Maak vervolgens een aangepaste application.css en sla deze op in een submap genaamd stylesheets:
Nyilvános / témák / my_theme / stíluslapok / application.css
Hieronder staat een voorbeeld van een aangepast stijlblad dat slechts een paar instellingen overschrijft:
/* laad het standaard Redmine-stijlblad */
@import url (../../../ stíluslapok / application.css);
/* voeg een logo toe in de header */
#fejléc {
    háttér: # 507AAA URL (../ images / logo.png) nincs ismétlés 2px;
    párnázat-bal: 86 képpont;
}
/* verplaats het projectmenu naar rechts */
#főmenü {
    balra: automatikus;
    jobbra: 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) letöltése als startpunt voor je saját aangepaste Redmine-thema. Pak het thema uit in de public/themes map.

Toepassen van aangepaste Javascript

Voeg gewoon je javascript toe in javascript /theme.js en het wordt automatisch geladen op elke pagina.

Instellen van Favicon

Voeg je favicon toe in de favicon map en het wordt automatisch geladen in plaats van de standaard favicon op elke pagina. De naam van het favicon-bestand kan alles zijn. (In het geval dat je het niet weet, is een favicon een klein 16x16 pixel icon dat dient voor de branding van je website. Het primaire doel is om bezoekers te helpen je pagina gemakkelijker te vinden wanneer zebla meerdereebben).

Toepassen van het aangepaste thema

• 1 lépés:

De eerste stap is het downloaden van een nieuw thema.

• 2 lépés:

Pak het thema uit in ../public/themes/. Het resultaat hiervan zou een map-pad naar application.css zijn, zoals

../public/themes/redminecrm/styleheets/application.css

• 3 lépés:

Ga naar Beheer -> Instellingen en Selecteer het thema dat je zojuist hebt gemaakt uit 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 je mogelijk de toepassing opnieuw starten zodat deze verschijnt in de beschikbare themalijst.

Structuur van het thema könyvtára

A legjobb téma uit deze bestanden:

• javascripts/theme.js (opcionális): aangepaste JavaScript voor het thema
• favicon / (opcionális): favicon voor het Redmine-thema
• stylesheets / application.css (noodzakelijk): CSS (Cascading Style Sheets) voor het thema

Dit wordt hieronder gedemonstreerd:
nyilvános/
  + - témák /
       +- /
            |
            + - favicon /
            | +- (bijv. favicon.ico, favicon.png)
            |
            + - javascriptek /
            | + - theme.js
            |
            + - stíluslapok /
                 + - application.css

Een Redmine-thema maden door het standaardthema te gebruiken

Je kunt ook een Redmine-thema maken door de kleuren in het CSS-bestand van het standaardthema te veranderen.

Stel dat je alles van een blauw thema naar een rood thema wilt veranderen. Dit kun je doen met de onderstaande CSS.

1. sh# cd / pad / naar / redmine
2. sh # mkdir -p public / témák / redtheme / stíluslapok
3. sh# vi public / themes / redtheme / stylesheets / application.css (wordt hieronder weergegeven kódolás)
4. Ga naar de beheerinstellingen en selecteer vervolgens redtheme

/* laad de standaard Redmine stíluslap */

@import url (../../../ stíluslapok / application.css);

# felső menü {háttér: RGB (128,0,0);}

#header {háttér szín: RGB (192,0,0);}

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

h1, h2, h3, h4 tartalom {szín: RGB (128,0,0);}

#main {szín: RGB (128,0,0); }

a, a: link, a: meglátogatott {szín: RGB (128,0,0); }

a: lebeg, a: aktív {szín: RGB (128,0,0); }

Hoe verander je het logó van het thema?

2^e STAP

Vervang het bestand logo.png ajtó het nieuwe logobestand met een grootte van 43x30

...

#header> h1 {

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

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

}