Как да създадете персонализирана тема за Redmine

Предимството на персонализираната тема е, че тя е уникална, а дизайнът е точно такъв, каквото искате (тази полза не е налична в повечето теми по подразбиране). Имате еластичността да проектирате персонализирана тема по всекикъв начин, който желаете. Въпреки това, че създаването на персонализирана тема може да изисква повече усилия в сравнение с добавянето на темата по подразбиране, резултатите са напълно стойностни. Прочетете, за да научите как да създадете персонализирана тема на Redmine.

Създаване на нова тема на Redmine

Redmine осигурява основна поддръжка на теми. Тези теми могат да добавят няколко персонализирани javascript и да заменят стиловете (application.css).
Първата стъпка е да създадете нова директория в public/themes. Името на директорията ще се използва като име на темата. Например: публични /теми / моята_тема.
След това създайте персонализиран application.css и го запазете в подпапка, наречена stylesheets:
Обществено / теми / my_theme / стилове / application.css
Следващият пример е за персонализиран стилов лист, който заменя само няколко настройки:
/* зарежда стандартния Redmine stylesheet */
@import url (../../../ стилове / application.css);
/* добавя лого в хедъра */
#header {
    фон: # 507AAA url (../ images / logo.png) без повторение 2px;
    padding-left: 86px;
}
/* премества менюто на проекта надясно */
#главно меню {
    вляво: автоматично;
    десен: 0px;
}
Посоченият по-горе пример прави предположението, че имате изображение, което се намира в my_theme / images / logo.png.
Можете да изтеглите тази тема (пример) като начална точка за вашата персонализирана тема в Redmine. Извлечете темата в директорията public/themes.

Добавяне на персонализиран Javascript

Просто включете своя javascript в javascript /theme.js и той ще се зареди автоматично на всяка страница.

Задаване на Favicon

Вмъкнете вашия favicon в папката favicon и той ще се зареди автоматично вместо стандартно на всяка страница. Името на favicon файл може да бъде каквото и да е. (Ако не знаете, favicon е малка икона с размер 16×16 пиксела, която служи за маркиране на сайта ви. Основната й цел е да помогне на посетителите да намерят страницата ви по-лесно, когато имат отворени няколко табове).

Приложение на персонализираната тема

• Етап 1:

Първата стъпка е да изтеглите нова тема.

• Стъпка 2:

Разархивирайте темата в ../public/themes/. Резултатът от това ще бъде път до application.css, като например

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

• Стъпка 3:

Отидете в Администрация -> Настройки и от списъка "Тема" (падащо меню) изберете темата, която сте създали наскоро. След това запазете настройките си.
В този момент Redmine трябва да се покаже с вашата персонализирана тема.

Ако използвате Redmine < 1.1.0, може да е необходимо да рестартирате приложението, за да се появи в списъка с наличните теми.

Структура на директорията на темите

Темата включва тези файлове:

• javascripts/theme.js (това е по избор): персонализиран JavaScript за темата
• фавикон / (това е по избор): favicon за темата на Redmine
• stylesheets / application.css (това е необходимо): CSS (Cascading Style Sheets) за темата

Това е демонстрирано по-долу:
обществена /
  + - теми /
       +- <име на тема>/
            |
            + - фавикон /
            | +- (например favicon.ico, favicon.png)
            |
            + - javascripts /
            | + - theme.js
            |
            + - таблици за стилове /
                 + - application.css

Създаване на тема в Redmine, като се използва темата за подразбиране

Можете също да създадете тема в Redmine, като промените цветовете в CSS файл на темата при подразбиране.

Кажете, че искате да промените всичко от синя тема на червено. Можете да го направите с CSS-а по-долу.

1. sh # cd / път / към / redmine
2. sh # mkdir -p public / теми / redtheme / стилове
3. sh# vi public / themes / redtheme / stylesheets / application.css (кодирането е показано по-долу)
4. Отидете на административните настройки и изберете redtheme

/* зарежда стилния лист на Redmine по подразбиране */

@import url (../../../ стилове / application.css);

# топ меню {фон: RGB (128,0,0);}

#header {фон-цвят: RGB (192,0,0);}

# проекти-индекс ul.projects div.root a.project {цвят: RGB (128,0,0); }

съдържание h1, h2, h3, h4 {цвят: RGB (128,0,0);}

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

a, a: връзка, a: посетен {цвят: RGB (128,0,0); }

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

Как да промените логото на темата?

1^VI стъпка:

запишете файла с логото в @./ public / themes / redminecrm / images@

2^ri Стъпка

Заменете файла logo.png с новия файл на логото с размер 43x30

...

#header> h1 {

               фон: url (../ images / logo.png) без повторение 10px 20%;

               подложка: 5px 60px; /* Променете това, за да зададете своето лого */

}