Hur man skapar ett anpassat Redmine-tema

Fördelen med ett anpassat tema är att det är unikt och designen är precis som du vill ha den (denna fördel finns inte med de flesta standardteman). Du har flexibiliteten att designa ett anpassat tema på vilket sätt du vill. Även om det kan kräva mer ansträngning att skapa ett anpassat tema jämfört med att använda ett standardtema, är resultatet helt värt det. Läs vidare för att lära dig hur du skapar ett anpassat Redmine-tema.

Skapande av ett mostt Redmine-tema

Redmine ger grundläggande stöd för teman. Dessa teman kann go to några anpassade JavaScript és åsidosätta stilmallar (application.css).
Första steget är att skapa en ny mapp i public/themes. Namnet på mappen kommer att användas som namnet på temat. Egészen példa: public/themes/my_theme.
Sedan skapar du en anpassad application.css och sparar den i en undermapp som heter stylesheets:
Public/themes/my_theme/stylesheets/application.css
Följande är ett exempel på en anpassad stilmall som bara åsidosätter några inställningar:
/* ladda standardsilmallen för Redmine */
@import url (../../../ stíluslapok / application.css);
/* lägg till en logotyp i sidhuvudet */
#fejléc {
    háttér: #507AAA url(../images/logo.png) no-repeat 2px;
    párnázat-bal: 86 képpont;
}
/* flytta projektmenyn till höger */
#főmenü {
    balra: automatikus;
    jobbra: 0px;
}
Ovanstående exempel förutsätter att du har en bild som är placerad i my_theme/images/logo.png.
Du kan ladda ner detta tema (exempel) som en startpunkt för ditt eget anpassade Redmine-tema. Extrahera temat és public/themes-mappen.

Tillägg av anpassad JavaScript

Inkludera bara din JavaScript i javascript/theme.js och den kommer att laddas automatiskt på varje sida.

Inställning av favicon

Infoga din favicon i favicon-mappen, och den kommer att laddas automatiskt istället för standardfaviconen på varje sida. Favicon-filens namn kan vara vad som helst. (Om du inte vet det är en favicon en liten 16x16 pixlars ikon som används för att marknadsföra din webbplats. Dess huvudsakliga syfte är att hjälpa besökare att hitta din sida lättare lättare flärna de kar).

Tillämpning av det anpassade temat

• 1. lépés:

Första steget är att ladda ner ett nytt tema.

• 2. lépés:

Packa upp temat i ../public/themes/. Eredmény av detta skulle vara en sökväg till application.css som till exempel

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

• 3. lépés:

Gå till Administration -> Inställningar och välj temat du nyss skapat från listan "Tema" (rullgardinsmeny). Spara dina inställningar efter detta.
Vid det här laget bör Redmine visa med ditt anpassade tema.

Om du använder Redmine < 1.1.0 kan det vara nödvändigt att starta om applikationen for att den ska visa i listan över tillgängliga teman.

Struktur för temamappar

Ett téma består av följande filer:

• javascripts/theme.js (valfritt): anpassad JavaScript för temat
• favicon / (valfritt): favicon för Redmine-temat
• stylesheets / application.css (nödvändigt): CSS (Cascading Style Sheets) för temat

Detta vízum nedan:
nyilvános/
  + - témák /
       +- /
            |
            + - favicon /
            | +- (pl. favicon.ico, favicon.png)
            |
            + - javascriptek /
            | + - theme.js
            |
            + - stíluslapok /
                 + - application.css

Hur man skapar ett Redmine-tema genom att använda standardtemat

Du kan också skapa ett Redmine-tema genom att ändra färgerna i CSS-filen för standardtemat.

Säg att du vill ändra allt från ett blått tema till ett rött. Det kan du göra med följande CSS.

1. sh# cd /út/útvonal/redmine
2. sh# mkdir -p public/themes/redtheme/stylesheets
3. sh# vi public/themes/redtheme/stylesheets/application.css (koden visas nedan)
4. Gå till admininställningarna och välj sedan redtheme

/* ladda standard-Redmine-silmallen */

@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); }

Hur man ändrar temats logó?

1:a lépés:

Helyezze el a logófájlt a @./public/themes/redminecrm/images@

2^a Steg

Ersätt logo.png filen med den nya logofilen med storleken 43x30

...

#header> h1 {

               háttér: url (../ images / logo.png) nincs ismétlés 10x 20%;

               padding: 5px 60px; /* Ändra detta för att ställa in din egen logotyp */

}