테마를 사용하여 사이트의 모양 변경

사용자 정의 캐스케이딩 스타일시트를 작성하고 사용자 정의 이미지를 제공하여 IBM® Rational® Asset Manager 웹 애플리케이션의 모양을 변경할 수 있습니다.

시작하기 전에

7.5.2 버전으로 업데이트하기 전에 Rational Asset Manager의 이전 릴리스에 대해 해당 테마를 사용자 정의하기 위해 기본 파일을 수정한 경우 현재 테마를 다운로드하십시오. 업데이트 중에 버전의 기본 테마로 현재 테마를 겹쳐씁니다. 서버에 대해 Rational Asset Manager 업데이트를 완료한 후 테스트 설치에 테마를 다시 적용하여 이전 버전에서 문제를 식별하십시오.

이 태스크 정보

저장소 관리자는 웹 애플리케이션 모양을 정의하는 이미지 및 캐스케이딩 스타일시트를 포함하는 아카이브를 다운로드할 수 있습니다. 이러한 파일이 사용자 정의되면 저장소 관리자는 업데이트된 아카이브를 업로드하여 변경사항을 구현합니다.

프로시저

  1. 저장소 관리자로 웹 클라이언트에 로그인하십시오.
  2. 관리를 클릭하십시오.
  3. 저장소 관리 사이드바에서 도구를 클릭하십시오.
  4. 도구 페이지에서 테마 관리 섹션을 찾으십시오.
  5. 현재 테마 다운로드를 클릭하십시오.
  6. currentTheme.zip 아카이브를 로컬 컴퓨터에 저장하십시오. 이 아카이브 파일에는 캐스케이딩 스타일시트(CSS), JSP(JavaServer Pages), 이미지 파일이 포함되어 있습니다.
  7. 아카이브의 압축을 푸십시오. 폴더 구조를 유지보수하십시오.
  8. 하나 이상의 CSS 파일을 작성하고 theme/custom/css 디렉토리에 저장하십시오.
  9. Rational Asset Manager와 함께 설치된 기본 스타일시트를 검토하십시오. 변경하려는 스타일에 대해서는 스타일 규칙을 CSS 파일에 복사하고 스타일을 편집하십시오. 새 CSS 파일 변경사항이 기본 스타일시트의 스타일 규칙을 대체합니다.
    중요사항: 테마 아카이브 파일에서 기본 스타일시트를 수정하지 마십시오. 이러한 스타일시트는 릴리스 간에 변경되고 Rational Asset Manager 업그레이드 시 겹쳐씁니다.
  10. theme/custom/cssIncludes.jspf에 사용자 정의 스타일시트를 링크로 추가하십시오. 예:

    <link rel="stylesheet" type="text/css" href="${pageContext.request.contextPath}/${applicationScope.themePath}/custom/css/jkeEnterprises.css" />

  11. 사용자 정의 디렉토리에서 images 폴더를 작성하고 그 안의 테마에 사용되는 이미지 파일을 저장하십시오. 예: theme/custom/images-jke-enterprises
  12. 업데이트된 파일을 포함하는 아카이브를 작성하십시오. 아카이브의 이름을 사용자 정의할 수 있지만, 이름이 "theme"인 폴더가 아카이브의 루트 폴더여야 합니다. 변경된 사항이 없어도, 작성한 사용자 정의된 CSS 파일에 더하여 테마 아카이브에 다음 파일이 포함되어야 합니다.
    • theme/custom/header.jspf: 로고 이미지, 로그인된 사용자의 이름, 로그인, 로그아웃, 도움말, 확장기능 링크를 포함합니다.
    • theme/custom/cssIncludes.jspf: 사용자 정의 CSS 파일에 대한 <link> 태그를 포함합니다.
    • theme/custom/homeContent.jspf: 홈 페이지의 컨텐츠 영역을 포함합니다.
    • theme/custom/jspHeader.jspf: 추가 배너 세부사항을 포함합니다.
    • theme/custom/requestAccess.jspf: 이 파일은 로그인 페이지의 로그인 양식 아래에 표시됩니다. 기본 테마에서 이 단편에 항목이 없지만 "비밀번호 분실" 또는 "등록" 등의 링크를 추가할 수 있는데, 이는 웹 애플리케이션에서 공통입니다.
    • theme/custom/requestAccessForm.jspf: 이 파일은 로그인 양식 아래에서 홈 페이지에 표시됩니다. 기본 테마에서 이 단편에 항목이 없지만 "비밀번호 분실" 또는 "등록" 등의 링크를 추가할 수 있는데, 이는 웹 애플리케이션에서 공통입니다.
    • theme/custom/css/advanced.css: 크기 및 위치에 대한 고급 CSS
    • theme/custom/css/basic.css: 이미지, 백그라운드, 글꼴 스타일에 대한 기본 CSS
    • theme/custom/css/hideRightColumn.css: 오른쪽 컬럼이 없는 페이지의 CSS
    • theme/custom/css/pageLayout.css: 일반 페이지 레이아웃의 CSS
    • theme/custom/css/showLeftColumn.css: 왼쪽 컬럼이 있는 페이지의 CSS
  13. 도구 페이지의 테마 관리 섹션에서 찾아보기를 클릭하십시오.
  14. 업데이트된 아카이브를 찾으십시오.
  15. 업로드를 클릭하십시오.

결과

새 테마가 적용됩니다. 변경사항이 표시되지 않으면 새로 고치기를 클릭하거나 브라우저의 단추를 다시 로드하십시오. 웹 브라우저의 캐시를 지워야 할 수도 있습니다. 웹 애플리케이션을 다시 시작할 필요가 없습니다. 테마가 올바르게 적용되었는지 확인하려면 웹 애플리케이션의 몇몇 페이지를 보십시오. 예상치 못한 결과가 표시되면 사용자 정의 CSS 파일을 수정하고 테마를 다시 업로드하십시오.

다음에 수행할 작업

테마 아카이브의 사본을 저장하십시오. 기존 테마를 복원해야 하는 경우 기본 테마 복원을 클릭하십시오.

웹 애플리케이션이 다시 배치되거나 새 버전으로 업그레이드되는 경우, 기본 테마가 적용되고 사용자 정의 테마를 업로드해야 합니다.


피드백