Korleis lage eit tilpassa Redmine-tema

6/3/2020
6 minutter
Lukáš Beňa
Redmine kjem med en rask og enkel administrativ måde for dig at bruge et tema som passer dine preferansar. Nokre av dei standardtemaene som er tilgjengelege er minimalistiske, andre er meir livlege, og om ingen af ​​disse alternative fenger deg, kan du lage dit eige tilpassa Redmine-tema.
Fordelen med et tilpasset tema er at det er unikt, og designet er præcist som du ønsker det (denne fordel er ikke tilgængelig med de fleste standardtemaer). Du har fleksibiliteten til at designe og tilpasse temaet akkurat som du vil. Selv om det kan kræve mere indsats for at lave og tilpasse temaer i modsætning til at bruge et standard tema, er resultatet helt klart det. Læs videre for at lære, hvordan du opretter og tilpasser Redmine-tema. Berigtigelse af et nyt Redmine-tema Redmine gir grundlæggende støtte til temaer. Disse temaer kan legges til nogen tilpasset JavaScript og overstyre stiler (application.css). Første trin er at oprette et nyt kort i public/themes. Navnet på kortet vil blive brugt som navnet på temaet. For eksempel: public/themes/my_theme. Opret oprettelse af en tilpasset application.css og lagre den i en undermappe kaldet stylesheets: Public/themes/my_theme/stylesheets/application.css. / @import url(../../../stylesheets/application.css); /* legg til et logo i headeren */ #header { baggrund: #507AAA url(../images/logo.png) no-repeat 2px; polstring-venstre: 86px; } /* flytt projektmenu til højre */ #main-menu { left: auto; højre: 0px; } Det nævnte eksempelet forudsetter du har et billede som er placeret i my_theme/images/logo.png. Du kan læse dette temaet (eksempel) som et udgangspunkt for dit eget tilpassede Redmine-tema. Pakk ud temaet i public/themes-mappen. Tillegg af tilpasset JavaScript Inkluder bare JavaScript-en din i javascript/theme.js, og den vil blive automatisk på hver side. Indstilling af Favicon Sett ind faviconen din i favicon-mappen, og den vil blive automatisk i stedet for standard favicon på hver side. Favicon-filens navn kan være hvad som helst. (Hvis du ikke vet det, er en favicon et lite 16x16 piksels ikon som tjener formålet med mærkevaren til webstedet. Hovedmålet er at hjælpe besøgende med at finde siden dine lettere, når de har flere faner åbne). Brug af det tilpassede temaet Trinn 1: Første trin er at læse ned et nyt tema. Trin 2: Pakk ud temaet i ../public/themes/. Resultatet af dette vil være en mappensti til application.css, for eksempel: ../public/themes/redminecrm/stylesheets/application.css Trinn 3: Gå til Administration -> Indstillinger og fra "Tema" -listen (rullegardinlisten), velg temaet du netop har oprettet. Efter dette, lagre indstillinger dine. På dette tidspunkt skal Redmine nå vises med det tilpassede tema. Hvis du bruger Redmine < 1.1.0, må du måske starte applikationen på nytt for at den skal vises i lytte over tilgængelige temaer.

Temaets katalogstruktur

Et tema består af denne fil:

  • javascripts/theme.js (dette er valgfritt): tilpasset JavaScript for temaet
  • favicon / (dette er valgfritt): favicon for Redmine-temaet
  • stylesheets / application.css (det er nødvendigt): CSS (Cascading Style Sheets) til temaet

Dette er demonstreret nedenfor:
offentlig/
  + - temaer /
       +- /
            |
            + - favicon /
            | +- (f.eks. favicon.ico, favicon.png)
            |
            + - javascripts /
            | + - theme.js
            |
            + - stilark /
                 + - ansøgning.css


Sådan oprettes du et Redmine-tema ved at bruge standardtemaet

Du kan også oprette et Redmine-tema ved at ændre farven i CSS-filen til standardtemaet.

Si at du vil endre alt fra et blått tema til et rødt tema. Dette kan du gøre med CSS-en nedenfor.

  1. sh# cd /sti/til/redmine
  2. sh# mkdir -p public/themes/redtheme/stylesheets
  3. sh# vi public/themes/redtheme/stylesheets/application.css (koder vises nedenfor)
  4. Gå til administratorindstillinger og derefter redtheme

/* last inn standard Redmine-stilark */

@import url (../../../ stilark / applikation.css);

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

#header {baggrund-farve: RGB (192,0,0);}

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

indhold h1, h2, h3, h4 {farve: RGB (128,0,0);}

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

a, a: link, a: besøgt {color: RGB (128,0,0); }

a: hover, a: aktiv {farve: RGB (128,0,0); }


Hvordan ændrer temaets logo?


1. trin:

Plasser logofilen i @./public/themes/redminecrm/images@

2nd Steg

Erstatt logo.png-filen med den nye logofilen med størrelsen 43x30

...

#header> h1 {

               baggrund: url(../images/logo.png) ingen gentakelse 10px 20%;

               polstring: 5px 60px; /* Endre dette for at sætte dit eget logo */

}

Den ultimative Redmine-opgraderingen? Enkel.

Få alt kraftigt værktøj til perfekt projektplanlægning, -styring og -kontrol i én software.

Prøv Easy Redmine i en 30-dagers gratis prøveperiode

Fuld funktionalitet, SSL-beskyttet, daglig sikkerhedskopiering, i din geografiske placering