Kuinka luoda räätälöity Redmine-teema

6/3/2020
6 minut
Lukáš Beňa
Redmine tulee mukana nopealla a helpolla hallintatavalla, jolla voit soveltaa teemaa, joka sopii mieltymyksiisi. Joitakin oletusteemoja aklamace minimalistický, toiset ovat enemmän virkistäviä, ja jos mikään näistä vaihtoehdoista ei miellytä sinua, voit luoda omán räätälöidyn Redmine-teeman.

Mukautetun teeman etuna on, että se on ainutlaatuinen ja sen suunnittelu on juuri sellainen kuin haluat (tämä etu ei ole saatavilla useimmissa oletusteemoissa). Sinulla na joustavuus suunnitella mukautettu teema haluamallasi tavalla. Vaikka mukautetun teeman luominen saattaa vaatia enemmän vaivaa verrattuna oletusteemaan, tulokset ovat ehdottomasti sen arvoisia. Další informace o mukautetun Redmine-teeman luomisesta.


Uuden Redmine-teeman luominen

Redmine tarjoaa perustuen tuen teemoille. Nämä teemat voivat lisätä muutamia mukautettuja JavaScript-tiedostoja ja korvata tyylitiedostoja (application.css).
Ensimmäinen vaihe on luoda uusi hakemisto public/themes-kansioon. Hakemiston nimi toimii teeman nimenä. Esimerkiksi: public/themes/my_theme.
Seuraavaksi luo mukautettu application.css a tallenna se alihakemistoon nimeltä styly:
Public/themes/my_theme/stylesheets/application.css
Seuraava esimerkki na mukautettu tyylitiedosto, joka korvaa vain muutamia asetuksia:
/* lataa oletus Redmine-tyylitiedosto */
@import url (../../../ styly / application.css);
/* lisää logo otsikkoon */
#záhlaví {
    tausta: #507AAA url(../images/logo.png) ei-toista 2px;
    vasen reuna: 86px;
}
/* siirrä projektivalikko oikealle */
#hlavní menu {
    vasen: auto;
    oikea: 0px;
}
Edellinen esimerkki olettaa, että sinulla on kuva, joka sijaitsee kohdassa my_theme/images/logo.png.
Voit ladata tämän teeman (esimerkki) lähtökohdaksi omalle mukautetulle Redmine-teemallesi. Pura teema public/themes-hakemistoon.


Mukautetun JavaScript v lisääminen

Lisää JavaScript-tiedostosi javascript/theme.js a se ladataan automaattisesti jokaisella sivulla.


Faviconin asettaminen

Lisää faviconisi favicon-kansioon, ja se ladataan automaattisesti jokaisella sivulla oletusversion sijaan. Favicon-tiedoston nimi voi olla mikä tahansa. (Jos et tiedä, favicon na pieni 16x16 pikselin kuvake, joka edustaa verkkosivustosi brändiä. Sen tarkoituksena na auttaa kävijöitä löytämään sivusi helpommin, kun heillä na useita aukilehtiä).


Mukautetun teeman käyttäminen

  • Vaihe 1:

Ensimmäinen vaihe na ladata uusi teema.

  • Fáze 2:

Pura teema kansioon ../public/themes/. Tämän seurauksena hakemistopolku application.css-tiedostoon olisi

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

  • Fáze 3:

Mene hallintapaneeliin -> Asetukset a valitse "Teema" -luettelosta (pudotusvalikko) juuri luomasi teema. Tämän jälkeen tallenna asetukset.
Tässä vaiheessa Redmine pitäisi näkyä mukautetun teeman avulla.

Jos käytät Redmine-versiota < 1.1.0, saatat joutua käynnistämään sovelluksen uudelleen, jotta se näkyy saatavilla olevien teemojen luettelossa.


Teemojen hakemistorakenne

Teema koostuu näistä tiedostoista:

  • javascripts/theme.js (tj. na valinnainen): mukautettu JavaScript-teemalle
  • favicon / (tämä on valinnainen): favicon Redmine-teemalle
  • styly / application.css (tämä on välttämätön): CSS (Cascading Style Sheets) teemalle

Tämä na esitetty alla:
veřejnost/
  + - témata /
       +- /
            |
            + - favicon /
            | +- (esim. favicon.ico, favicon.png)
            |
            + - javascripty /
            | + - theme.js
            |
            + - styly /
                 + - application.css

Redmine-teeman luominen oletusteemaa käyttämällä

Podívejte se na můj přítel Redmine-teeman muuttamalla värejä oletusteeman CSS-tiedostossa.

Oletetaan, että haluat muuttaa kaiken sinisestä teemasta punaiseksi. Použijte všechny možnosti CSS:llä.

  1. sh# cd /polku/redmineen
  2. sh# mkdir -p public/themes/redtheme/stylesheets
  3. sh# vi public/themes/redtheme/stylesheets/application.css (koodaus na esitetty alla)
  4. Mene hallintasetuksiin a valitse sitten redtheme

/* lataa oletus Redmine-tyylitiedosto */

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


Logo Miten vaihdetaan teeman?


1. vaihe:

Aseta logotiedosto @./public/themes/redminecrm/images@


2nd Krok

Korvaa logo.png tiedosto uudella logotiedostolla, jonka koko na 43x30

...

#header> h1 {

               tausta: url(../images/logo.png) ei-toista 10px 20 %;

               täyttö: 5px 60px; /* Muokkaa tätä asettaaksesi oman logosi */

}

Redmine-päivitys, joka vie sinut uudelle tasolle? Helppoa.

Saat kaikki tehokkaat työkalut täydelliseen projektisuunnitteluun, hallintaan ja valvontaan yhdessä ohjelmistossa.

Kokeile Easy Redmine -ohjelmaa 30 päivän ilmaisella kokeilujaksolla

Täydet ominaisuudet, SSL-suojattu, päivittäiset varmuuskopiot, sijaintisi mukaan