XE 코어 스킨의 이해

스킨(skin)은 어떤 일을 할까?

fashionshow

위 이미지는 동생의 패션쇼 장면입니다. 남성복을 디자인하죠. 패션쇼 과정을 무대 뒤에서 지켜보면 런웨이에서의 도도한 걸음걸이, 자신감 있는 모습과는 정반대의 모델들을 보게 됩니다. 모델 한 사람당 갈아입고 나가야 할 옷이 적게는 6~7 벌에서 많게는 12벌도 넘습니다. 그러다보니 앞선 모델이 한바퀴 돌고 올 동안에 가능한한 빨리 다음 옷으로 갈아 입어야 하지요. 마치 전쟁터와 같습니다. 그러면서도 런웨이에 발을 올려 놓는 순간 발걸음과 몸짓 하나하나는 곧 도도함의 극치를 이룹니다.

image

모듈의 스킨 역시 패션쇼와 같습니다. 게시판에서 작성된 글의 데이타(DATA)는 고스란히 DB의 xe_documents 테이블에 저장이 되어 있다가 필요한 경우에 미리 준비된 옷을 입고 나옵니다. DB(Database)가 무엇이냐구요? DB는 쉽게 말해 엑셀문서라고 생각하시면 이해가 빠릅니다. 각각의 컬럼마다 작성된 내용의 정보들이 가장 작은 단위로 조각조각 분해되고 나뉘어져 저장됩니다. 문서번호, 제목, 내용, 일자, 시간 등등...

image

"DB에 글을 저장한다"는 것은, XE 코어 프로그램이 미리 만들어 둔 함수의 규칙에 따라 게시판의 모듈 프로그램이 이를 실행하는 과정을 반복하는 것입니다.

image

이러한 과정은 런웨이 뒷쪽의 일이고 우리가 보고 있는 게시판의 모습은 결국 스킨 디자인너가 만든 패션쇼인 것이죠. 그런데 스킨은 모듈의 속옷(underwear)을 디자인 합니다. 좀더 자세히 설명하면 모듈은 자신의 프로그램 폴더 안에 코어의 요청에 응답하기 위해서 적어도 자기자신 스스로가 입고 나갈 옷 한 벌씩은 꼭 준비해 두었습니다. 이것이 스킨(skin) 폴더입니다. 따라서 스킨은 해당 모듈 프로그램 디렉터리 안에 존재합니다.

image

스킨은 디자인 요소입니다. 코어의 요청에 대한 응답으로 모듈은 DB에서 자료를 찾아 옵니다. 그리고 찾아온 내용들을 정리하여 목록으로 들고갈 때 스킨이 없다면 위 그림과 같을 것입니다. 결국 스킨은 콘텐츠를 보기 좋게 꾸미는 디자이너(CSS)의 도움이 필요합니다.


레이아웃(layout)도 스킨일까?

레이아웃도 스킨입니다. 이때 레이아웃은 겉 옷과 같습니다. 레이아웃 폴더는 모듈 디렉터리 바깥에 존재하고 어떤 모듈이 어떤 옷을 입고 나갈지 모르기 때문에 다양한 디자인의 옷들을 미리 준비해 둡니다. 그리고 헤더와 메뉴, 사이드바와 푸터 요소로 화려하게 디자인 된 레이아웃 파일 안에는 모듈이 사용할 수 있도록 $content 라는 내용변수만 남겨 둡니다.

모듈은 자신이 사용할 기본적인 스킨을 이미 가지고 있고 선택적으로 레이아웃을 활용하는 것입니다. 모듈의 스킨은 반드시 입어야 하는 기본값이고 레이아웃은 선택적으로 활용할 수 있는 옵션값입니다. 따라서 스킨과 레이아웃의 설정은 모듈 생성 단계에서 옵션 설정으로 존재하며 스킨과 레이아웃은 모두 디자인 요소에 속합니다.

XE 코어를 다루다 보면 자신의 웹사이트에 특성화 된 레이아웃을 만들어 보고 싶고 또한 레이아웃 스타일에 알맞는 모듈 스킨도 필요하게 됩니다. 여러분도 멋진 게시판과 레이아웃의 디자이너가 될 수 있습니다. 단, 훌륭한 디자이너도 학교에서는 천을 재단하는 방법과 바느질하는 방법만 배우듯 스킨의 디자인은 코어를 다루는 역량과 개인의 디자인적 감각에 속합니다. 따라서 프로그램 언어와 포토샵 등의 공부를 열심히 해야 합니다.


스킨 디렉터리

스킨은 각 모듈의 skins 폴더 안에 들어있습니다. 스킨은 모듈 뿐만아니라 위젯, 애드온 등 여러 곳에서 사용자의 필요에 따라 추가하고 적용할 수 있도록 설계 되어 있습니다. 따라서 게시판(board 모듈 기준)의 스킨은 "/xe/modules/board/skins/스킨의 폴더이름"으로 업로드하고 사용하지만 그 밖의 스킨 등은 각각 해당 경로가 달라짐으로 반드시 주의해야 할 부분입니다. XE 공식 홈페이지 다운로드 자료실에서 모듈 또는 위젯의 스킨 디자인을 다운로드 받게 되면 반드시 설치 경로를 확인한 후 정확한 디렉터리 안에 스킨 파일을 업로드 해야만 정상적으로 작동하게 됩니다.


스킨 적용하기

스킨의 업로드와 적용은 너무나 간단합니다. XE 공식 홈페이지 다운로드 자료실에서 모듈 및 위젯의 스킨 파일을 다운로드 받아 해당 모듈과 위젯의 스킨(skins, 스킨들을 모아 놓은 폴더) 디렉터리에 업로드 하면 됩니다. 그리고 모듈 또는 위젯 등의 옵션 설정에서 해당 스킨을 선택해 주면 끝! 스킨을 잘못 업로드 했다고 해서 DB가 고장나거나 못쓰게 되는 것은 절대 아닙니다. 새로운 디자인의 옷을 얻었다면 그저 몸에 꼭 맞게 잘 입으면 그만인 것처럼, 실수가 있다면 업로드의 경로를 다시한번 꼼꼼히 확인한 후에 다시 업로드하고 사용하면 됩니다.

TIP - 내컴퓨터 계정 관리 폴더에서는 서버와 같은 트리구조를 유지해 가면서 사용자 추가 스킨을 관리하세요.
예) /xe/modules/board/skins/추가 스킨 폴더