en
지원하는 언어
  • en
  • de
  • fr
  • es
  • br
  • ru
  • jp
  • kr
AI 번역
  • ae
  • cn
  • vn
  • id
  • eu
  • il
  • gr
  • no
  • fi
  • dk
  • se
  • tr
  • bg
  • nl
  • it
  • pl
  • hu
  • ro
  • ua
  • cs

커스텀 Redmine 테마를 만드는 방법

6/3/2020
6 분
루카시 베사

Redmine은 귀하가 선호하는 테마를 적용 할 수있는 빠르고 쉬운 관리 방법을 제공합니다. 몇 가지 기본 테마 사용 가능 최소한의다른 사람들은 더 활기찬, 이러한 옵션 중 어느 것도 마음에 들지 않으면 만들 수 있습니다 나만의 맞춤형 Redmine 테마.

사용자 정의 테마의 장점은 고유하고 디자인이 원하는 대로 정확히 일치한다는 것입니다(이 이점은 대부분의 기본 테마에서 사용할 수 없음). 원하는 방식으로 사용자 정의 테마를 유연하게 디자인할 수 있습니다. 기본 테마를 사용하는 것보다 사용자 지정 테마를 만드는 데 더 많은 노력이 필요할 수 있지만 결과는 그만한 가치가 있습니다. 사용자 지정 Redmine 테마를 만드는 방법을 배우려면 계속 읽으십시오.


새로운 Redmine 테마 생성

Redmine은 테마에 대한 기본적인 지원을 제공합니다. 이러한 테마는 몇 가지 사용자 정의 자바 스크립트를 추가하고 스타일 시트 (application.css)를 대체 할 수 있습니다.
첫 번째 단계는 public / themes에 새 디렉토리를 만드는 것입니다. 디렉토리 이름이 테마 이름으로 사용됩니다. 예 : public / themes / my_theme.
다음으로 사용자 정의 application.css를 만들고이를 스타일 시트라는 하위 폴더에 저장합니다.
공개 / 테마 / my_theme / 스타일 시트 / application.css
다음은 몇 가지 설정 만 재정의하는 사용자 정의 스타일 시트 예제입니다.
/ * 기본 Redmine 스타일 시트를로드합니다 * /
@import url (../../../ stylesheets / application.css);
/ * 헤더에 로고 추가 * /
#헤더 {
    배경 : # 507AAA url (../ images / logo.png) 무 반복 2px;
    왼쪽 여백 : 86px;
}
/ * 프로젝트 메뉴를 오른쪽으로 이동 * /
# main-menu {
    왼쪽 : 자동;
    오른쪽 : 0px;
}
앞서 언급 한 예에서는 my_theme / images / logo.png에있는 이미지가 있다고 가정합니다.
이 테마 (샘플)를 사용자 지정 Redmine 테마의 시작점으로 다운로드 할 수 있습니다. public / themes 디렉토리에서 테마를 추출하십시오.


커스텀 자바 스크립트 추가

javascript /theme.js에 자바 스크립트를 포함하면 모든 페이지에 자동으로로드됩니다.


파비콘 설정

파비콘 폴더에 파비콘을 삽입하면 모든 페이지에 기본 파비콘이 아닌 자동으로 로드됩니다. 파비콘 파일의 이름은 무엇이든 될 수 있습니다. (모르는 경우를 대비하여 파비콘은 웹사이트 브랜딩의 목적을 제공하는 작은 16×16 픽셀 아이콘입니다. 주요 목적은 방문자가 여러 탭을 열었을 때 페이지를 더 쉽게 찾을 수 있도록 돕는 것입니다.)


사용자 정의 테마 적용

  • 1 단계 :

첫 번째 단계는 새로운 테마를 다운로드하는 것입니다.

  • 2단계:

../public/themes/에 테마의 압축을 풉니 다. 그 결과는 다음과 같은 application.css의 디렉토리 경로가됩니다.

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

  • 3단계:

관리-> 설정으로 이동하여 "테마"목록 (드롭 다운 목록)에서 새로 만든 테마를 선택합니다. 그런 다음 설정을 저장하십시오.
이제 Redmine은 이제 사용자 정의 테마를 사용하여 표시되어야합니다.

Redmine <1.1.0을 사용하는 경우 사용 가능한 테마 목록에 표시되도록 응용 프로그램을 다시 시작해야 할 수 있습니다.


테마 디렉토리 구조

테마는 다음 파일로 구성됩니다.

  • javascripts / theme.js (선택 사항) : 테마에 맞게 사용자 정의 된 JavaScript
  • 파비콘 / (선택 사항) : Redmine 테마의 파비콘
  • stylesheets / application.css (필수) : 테마 용 CSS (Cascading Style Sheets)

아래에 설명되어 있습니다.
공공의/
  +-테마 /
       +- /
            |
            +-favicon /
            | +- (예 : favicon.ico, favicon.png)
            |
            +-자바 스크립트 /
            | +-theme.js
            |
            +-스타일 시트 /
                 +-application.css


기본 테마를 사용하여 레드 마인 테마 만들기

기본 테마의 CSS 파일에서 색상을 변경하여 Redmine 테마를 만들 수도 있습니다.

파란색 테마에서 빨간색 테마로 모든 것을 변경하고 싶다고 가정 해보십시오. 아래 CSS로 그렇게 할 수 있습니다.

  1. sh # cd / path / ~ / 레드 마인
  2. sh # mkdir -p public / 테마 / redtheme / 스타일 시트
  3. sh # vi public / themes / redtheme / stylesheets / application.css (코딩은 아래와 같습니다)
  4. 관리자 설정으로 가서 redtheme을 선택하십시오.

/ * 기본 Redmine 스타일 시트를로드합니다 * /

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

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

#header {배경색 : RGB (192,0,0);}

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

내용 h1, h2, h3, h4 {color : RGB (128,0,0);}

# 메인 {색상 : RGB (128,0,0); }

a, a : 링크, a : 방문한 {색상 : RGB (128,0,0); }

a : 호버, a : active {색상 : RGB (128,0,0); }


테마 로고를 변경하는 방법?


1st 단계:

로고 파일을 @. / public / themes / redminecrm / images @에 넣습니다.


2nd 단계

logo.png 파일을 43x30 크기의 새 로고 파일로 대체

...

#header> h1 {

               배경 : url (../ images / logo.png) 무 반복 10px 20 %;

               패딩 : 5px 60px; / * 자신의 로고를 설정하려면 이것을 수정하십시오 * /

}

궁극적 인 Redmine 업그레이드? 쉬운.

완벽한 프로젝트 계획, 관리 및 제어를위한 모든 강력한 도구를 하나의 소프트웨어에서 얻을 수 있습니다.

30일 무료 평가판으로 Easy Redmine을 사용해 보세요

지리적 위치에서 모든 기능, SSL 보호, 일일 백업