This is automatic translation. If you do not like it, switch to English or another language. Thank you for understanding. OK Show original
함유량

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

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

사용자 정의 테마의 장점은 독창적이고 디자인이 원하는 방식과 정확히 일치한다는 것입니다 (대부분의 기본 테마에서는이 이점을 사용할 수 없음). 원하는대로 사용자 정의 테마를 디자인 할 수있는 유연성이 있습니다.

기본 테마를 사용하는 대신 사용자 정의 테마를 만드는 데 더 많은 노력이 필요하지만 결과는 그만한 가치가 있습니다.

커스텀 Redmine 테마를 만드는 방법을 배우려면 계속 읽으십시오.

새로운 Redmine 테마 생성

Redmine은 테마에 대한 기본적인 지원을 제공합니다. 이러한 테마는 몇 가지 사용자 정의 자바 스크립트를 추가하고 스타일 시트 (application.css)를 대체 할 수 있습니다.

The first step is to create a new directory in public/themes. The name of the directory will be used as the name of the theme. For example:  public /themes / my_theme.

Next, create custom application.css and save this in a subfolder called stylesheets:

공개 / 테마 / my_theme / 스타일 시트 / application.css

다음은 몇 가지 설정 만 재정의하는 사용자 정의 스타일 시트 예제입니다.

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

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

/ * 헤더에 로고 추가 * /

#헤더 {

    배경 : # 507AAA url (../ images / logo.png) 무 반복 2px;

    왼쪽 여백 : 86px;

}

/ * 프로젝트 메뉴를 오른쪽으로 이동 * /

# main-menu {

    왼쪽 : 자동;

    오른쪽 : 0px;

}

The aforementioned example makes the assumption that you have an image that is located at my_theme / images / logo.png.

You may download this theme (sample) as a beginning point for your own custom Redmine theme. Extract the theme in the public/themes directory.

커스텀 자바 스크립트 추가

Just include your javascript in javascript /theme.js and it will be loaded on every page automatically.

파비콘 설정

Insert your favicon in the favicon folder, and it will be loaded automatically rather than default one on every page. The favicon file's name can be anything

(알 수없는 경우 파비콘은 웹 사이트의 브랜딩을 목적으로하는 작은 16 × 16 픽셀 아이콘입니다. 주요 목표는 방문자가 여러 개의 탭을 열었을 때 페이지를 더 쉽게 찾을 수 있도록 돕는 것입니다).

사용자 정의 테마 적용

  • 1 단계 :

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

  • 단계 2:

Unzip the theme into ../public/themes/. The result of this would be a directory-path to application.css such as

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

  • 단계 3:

Head over to Administration -> Settings and from the "Theme" list (drop-down list), select the theme that you have newly created. After this, save your settings.
이제 Redmine은 이제 사용자 정의 테마를 사용하여 표시되어야합니다.

If you are making use of Redmine < 1.1.0, you might have to restart the application so that it appears in the available themes list.

테마 디렉토리 구조

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

  • javascripts/theme.js (this is optional): customized JavaScript for the theme
  • favicon / <favicon file> (this is optional): favicon for the Redmine theme
  • stylesheets / application.css (this is necessary): CSS ( Cascading Style Sheets) for the theme

아래에 설명되어 있습니다.

공공의/

  +-테마 /

       +- <theme name>/

            |

            +-favicon /

            |    +- <favicon file> (e.g. 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 (coding is shown below)
  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; / * 자신의 로고를 설정하려면 이것을 수정하십시오 * /

}

 

저자 : Sa Bal, Lukáš Beňa

상품 추가정보
무료 시험판

쉬운 Redmine 10 업그레이드
인기 플러그인 및 기능
신규 및 모바일 디자인
서버 업그레이드
글로벌 클라우드

무료 평가판 시작

30 일 무료 평가판에서 Easy Redmine을 사용해보십시오

모든 기능을 갖춘 30 일, SSL로 보호 된 일일 백업, 지리적 위치에서

or