Header 커스터마이징

알프레스코를 기반으로 제품을 만들기 위해서는 커스터마이징이 필요하다.

이번 포스팅에서는 header 영역에 외부 링크를 연결시키는 방법을 연구해보았다.

더보기

기본적인 알프레스코 헤더는 아래와 같다. 아래 부분에 Naver 링크를 추가할 것이다.

share-config-custom.xml 수정 (링크 추가)

1. share-config.xml 에서 header 설정을 확인한다.

"<configRootShare>/classes/alfresco/share-config.xml"


파일을 오픈한다. 예를 들어 톰캣이라면


"<TOMCAT_HOME>/webapps/share/WEB-INF/classes/alfresco/share-config.xml"


파일을 연다.

<br/> <alfresco-config><br/><br/> <!-- Global config section --><br/> <config replace="true"><br/> <flags><br/> <!--<br/> Developer debugging setting to turn on DEBUG mode for client scripts in the browser<br/> --><br/> <client-debug>false</client-debug><br/><br/> <!--<br/> LOGGING can always be toggled at runtime when in DEBUG mode (Ctrl, Ctrl, Shift, Shift).<br/> This flag automatically activates logging on page load.<br/> --><br/> <client-debug-autologging>false</client-debug-autologging><br/> </flags><br/> <br/> <header><br/> <app-items><br/> <!-- defaults: icon="{id}.png" label="header.{id}.label" description="header.{id}.description" --><br/> <item type="link" id="my-dashboard">{userdashboardpage}</item><br/> <item type="js" id="sites">Alfresco.module.Sites</item><br/> <item type="link" id="people">/people-finder</item><br/> <item type="link" id="repository" condition="conditionRepositoryRootNode">/repository</item><br/> <item type="container" id="more"><br/> <container-group id="my"><br/> <item type="link" id="my-tasks">/my-tasks#filter=workflows|active</item><br/> <item type="link" id="my-workflows">/my-workflows#filter=workflows|active</item><br/> <item type="link" id="my-content">/user/user-content</item><br/> <item type="link" id="my-sites">/user/user-sites</item><br/> <item type="link" id="my-profile">{userprofilepage}</item><br/> </container-group><br/> <container-group id="tools" permission="admin"><br/> <item type="link" id="application">/console/admin-console/application</item><br/> <item type="link" id="groups">/console/admin-console/groups</item><br/> <item type="link" id="replication-jobs" condition="!conditionEditionTeam">/console/admin-console/replication-jobs</item><br/> <item type="link" id="repository">/console/admin-console/repository</item><br/> <item type="link" id="trashcan">/console/admin-console/trashcan</item><br/> <item type="link" id="users">/console/admin-console/users</item><br/> <item type="link" id="more">/console/admin-console/</item><br/> </container-group><br/> </item><br/> </app-items><br/> <user-items><br/> <item type="container" id="user" icon="" description=""><br/> <container-group id="usermenu" label=""><br/> <item type="user" id="status">{userprofilepage}</item><br/> <item type="link" id="my-profile">{userprofilepage}</item><br/> <item type="link" id="change-password" condition="user.capabilities.isMutable">/user/change-password</item><br/> <item type="external-link" id="help">{share-help}</item><br/> <item type="link" id="logout" condition="!context.externalAuthentication">/dologout</item><br/> </container-group><br/> </item><br/> </user-items><br/> <dependencies><br/> <css src="/modules/create-site.css" /><br/> <css src="/modules/header/sites.css" /><br/> <js src="/modules/create-site.js" /><br/> <js src="/modules/header/sites.js" /><br/> </dependencies><br/> </header> <br/> </config><br/> <br/> ...<br/> <br/></alfresco-config><br/>

위와 같이 "Global config" 영역에 헤더가 정의되어 있다.

2. share-config-custom.xml.sample 파일을 오픈한다.

"<web-extension>/share-config-custom.xml.sample" 파일을 오픈한다. 예를 들어 톰캣이라면 "<TOMCAT_HOME>/shared/classes/alfresco/web-extension/share-config-custom.xml.sample" 파일을 연다.

<br/> <alfresco-config><br/><br/> <!-- Global config section --><br/> <config replace="true"><br/> <flags><br/> <!--<br/> Developer debugging setting to turn on DEBUG mode for client scripts in the browser<br/> --><br/> <client-debug>false</client-debug><br/><br/> <!--<br/> LOGGING can always be toggled at runtime when in DEBUG mode (Ctrl, Ctrl, Shift, Shift).<br/> This flag automatically activates logging on page load.<br/> --><br/> <client-debug-autologging>false</client-debug-autologging><br/> </flags><br/> </config><br/> <br/> ...<br/> <br/></alfresco-config><br/>

1번의 <header> 부분을 share-config-custom.xml 파일에 복사합니다.

3. naver 링크 추가

alfresco-config > config > header > app-items 에 새로운 item 엘리먼트를 추가한다.

<br/> <header><br/> <app-items><br/> <!-- defaults: icon="{id}.png" label="header.{id}.label" description="header.{id}.description" --><br/> <item type="link" id="my-dashboard">{userdashboardpage}</item><br/> <item type="js" id="sites">Alfresco.module.Sites</item><br/> <item type="link" id="people">/people-finder</item><br/> <item type="link" id="repository" condition="conditionRepositoryRootNode">/repository</item><br/> <item type="external-link" id="naver">http://www.naver.com</item><br/> <br/> ...<br/> <br/> </app-items><br/></header><br/>

위의 8번 줄과 같이 naver 링크를 추가한다. (item 엘리먼트의 자세한 설명은 다른 포스팅을 통해 정리할 예정이다)

4. share-config-custom.xml 파일로 저장한다.

"<web-extension>/share-config-custom.xml" 파일로 저장한다. 예를 들어 톰캣이라면 "<TOMCAT_HOME>/shared/classes/alfresco/web-extension/share-config-custom.xml" 파일로 저장한다.

Label & Description & Icon 설정

위의 설정을 추가한 후, 알프레스코를 재시작 하면 "header.naver.id" 라는 레이블의 링크가 생긴다. 이러한 링크를 원하는 레이블로 변경하려면 다음과 같은 작업이 필요하다.

1. share-config-custom.xml 파일로 저장한다.

"<configRootShare>/classes/alfresco/messages/slingshot.properties" 파일을 오픈한다. 예를 들어 톰캣이라면 "<TOMCAT_HOME>/webapps/share/WEB-INF/classes/alfresco/messages/slingshot.properties" 파일을 연다.

header.naver.label=Naver

header.naver.description=Naver...

위의 label 과 description 을 추가한 후, 알프레스코를 재시작하면 정상적으로 label 과 description 이 표시된다. 하지만 아이콘이 없어 다른 링크와 어울리지 않는다.

2. icon 이미지를 추가한다.

이번 포스팅에서 사용하는 네이버 링크의 이미지는 네이버에서 16 x 16 사이즈의 png 이미지를 다운받았다. 이 파일을 "naver.png" 로 저장한 후 (<item id="{id}" /> 에서 사용한 {id}.png 로 저장한다) "<TOMCAT_HOME>/webapps/share/components/images/header" 디렉토리에 복사한다.

이미지는 재시작하지 않아도 바로 확인할 수 있다.

이상으로 알프레스코 헤더에 외부 링크를 붙이는 방법을 마친다.

참고자료

• 
  
  http://forums.alfresco.com/forum/installation-upgrades-configuration-integration/configuration/customize-head-menu-09032012
  
  


• 
  
  http://docs.alfresco.com/4.2/index.jsp?topic=%2Fcom.alfresco.enterprise.doc%2Ftasks%2Fshare-repodoclib-hide.html