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 Resultsatet helt värt det. Läs vidare för att lära dig hur du skapar ett anpassat Redmine-tema.

Skapande av ett nytt Redmine-tema

Redmine ger grundläggande stöd för teman. Dessa teman kan lägga do några anpassade JavaScript i å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. Do przykładu: public/themes/my_theme.
Sedan skapar du en anpassad application.css i sparar den i en undermap z różnymi arkuszami stylów:
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 standardytilmallen dla Redmine */
@import url (../../../ stylesheets / application.css);
/* lägg to en logotyp i sidhuvudet */
#nagłówek {
    tło: #507AAA url(../images/logo.png) bez powtórzeń 2px;
    dopełnienie lewe: 86px;
}
/* flytta projektmenyn do höger */
#menu główne {
    po lewej: auto;
    po prawej: 0px;
}
Ovanstående exempel förutsätter att du har en obraz na miejscu w my_theme/images/logo.png.
Możesz pobrać ten motyw (przykład) jako punkt startowy dla tego samego motywu Redmine-tema. Extrahera temat w public/themes-mappen.

Tillägg przez anpassad JavaScript

Włącza bara din JavaScript w javascript/theme.js i kommer att laddas automatiskt på varje sida.

Instalacja ulubionych ikon

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 intevet det är en favicon en liten 16x16 pixlars ikon som används för att marknadsföra din webplats. Dess huvudsakliga syfte är att hjälpa besökare att hitta din sida lättare när de har flera flikar öppna).

Tillämpning av det anpassade temat

• Krok 1:

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

• Etap 2:

Przejdź do tematu w ../public/themes/. Wynik av detta Skulle vara en sökväg do aplikacji.css do przykładu

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

• Etap 3:

Przejdź do administracji -> 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 wizy z tym tematem.

Om du använder Redmine < 1.1.0 może det vara nödvändigt att starta om aplikacji for att den ska wizy i listan över dogängliga teman.

Struktur dla temamappar

Najlepszy motyw dla följande filer:

• javascripts/theme.js (valfritt): anpassad JavaScript dla tematu
• favikona / (valfritt): favicon dla tematu Redmine
• arkusze stylów / application.css (nödvändigt): CSS (Kaskadowe arkusze stylów) dla tematu

Detta wizy nedan:
publiczny/
  + - motywy /
       +- /
            |
            + - favicon /
            | +- (t.ex. favicon.ico, favicon.png)
            |
            + - javascripts /
            | + - theme.js
            |
            + - arkusze stylów /
                 + - application.css

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

Możesz också skapa ett Redmine-tema genom att ändra färgerna i CSS-filen dla standardowego tematu.

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

1. sh# cd /ścieżka/do/redmine
2. sh# mkdir -p public/themes/redtheme/stylesheets
3. sh# vi public/themes/redtheme/stylesheets/application.css (koden wizy nedan)
4. Gå do admininställningarna i och välj sedan redtheme

/* ladda standard-Redmine-stilmallen */

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

# menu główne {tło: RGB (128,0,0);}

#header {kolor tła: RGB (192,0,0);}

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

zawartość h1, h2, h3, h4 {kolor: RGB (128,0,0);}

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

a, a: link, a: odwiedzono {kolor: RGB (128,0,0); }

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

Chcesz logotyp tematów?

1: stopień:

Umieść logo w @./public/themes/redminecrm/images@

2^a Steg

Dodaj logo.png plik z nowym logoplik z zapisanym logo 43x30

...

#header> h1 {

               tło: url (../ images / logo.png) bez powtarzania 10px 20%;

               dopełnienie: 5px 60px; /* Ęndra detta för att ställa in din egen logotyp */

}