적용버전 : XpressEngine 공통 레이아웃에서 내용 변수 사용하기

콘텐츠를 보여주세요!

{$content}로 내용을 불러옵니다.

레이아웃의 구조 작성이나 기능적인 요소들의 배치가 끝나게 되면 본문에 출력될 내용을 불러오기 위해 $content 변수를 사용합니다. $content 변수는 페이지 또는 외부페이지 모듈과 게시판 모듈을 이용해 생성된 독립적인 내용들을 구조적으로 배치된 레이아웃 안으로 불러들이는 내용 변수입니다. 각각의 모듈 생성과정에서 항상 존재하는 레이아웃 선택 옵션은 이러한 내용물들이 독립적으로 사용되기 보다는 잘 꾸며진 레이아웃 안에서 더욱 돋보이도록 합니다.

image

레이아웃의 콘텐츠 영역으로 사용될 본문 영역이 정해지면 내용 변수를 이용해 해당 모듈을 불러와 삽입하게 됩니다.

<div id="content">
   {$content}
</div>

본문의 내용을 감싸는 DIV 박스의 선택자는 자유롭게 네이밍하시면 됩니다. id="content" 라고 사용해도 좋고 class="content" 라고 해도 좋습니다. 자유롭게 사용하시면 됩니다. 다만, 본문의 내용이 흘러넘쳐 레이아웃이 흐트러지는 경우가 발생할 수 있습니다. 예를 들어 이미지 등이 본문 영역으로 정해놓은 DIV 박스의 가로 값보다 클경우 옆으로 늘어난다거나 레이아웃 바깥으로 흘러넘쳐 보일 수 있겠지요? 이런 경우 CSS에서 overflow: hidden 속성을 이용하면 가로방향으로 흘러넘치는 내용은 보이지 않게 되고 레이아웃의 구조 역시 유지될 수 있습니다.

#content {float:right; width:720px; display:inline; padding-right:20px; overflow: hidden;}

내용 변수의 특기

$content 변수를 내용 변수라고 부르는데 이것을 왜 변수라고 부를까요? XE 코어만 가지고 있는 재미있는 동작 원리중에 하나는 {$content} 영역 안에서 또다른 액션(action)을 실행할 수 있기 때문입니다. 예를 들어서 자유게시판 모듈 페이지를 부를때 xe/?mid=xeschool_board 라고 불러봅니다. XE 템플릿 구문을 이용한다면 {getUrl('mid','xeschool_board')} 라고 할 수 있겠지요? 그러면 아래의 밑바탕 그림처럼 게시판 모듈 페이지가 불려 나옵니다.

그런데 만약 같은 모듈의 이름을 부르면서 "회원가입을 받아라!" 고 하는 동작을 명령하면 어떻게 될까요?

<a href="{getUrl('mid','xeschool_board','act','dispMemberSignUpForm')}">회원가입</a>

image

XE는 한치의 망설임도 없이 게시판 모듈 페이지 안에서 회원가입 폼을 보여주게 됩니다. 회원가입 뿐만 아니라 시키는 모든 동작을 받아서 처리하게 되지요. 일이 끝나게 되면 다시 본래의 게시판 모듈을 보여주게 됩니다. 따라서 내용 변수라는 것은 XE만이 가지고 있는 아주 특별한 특기랍니다. 그런데 문제가 생겼습니다. 회원가입을 받는다거나 정보를 수정하게 될 때는 서브 메뉴의 이름이 달라져야 합니다. 게시판이 아닌 회원가입 또는 회원정보수정 등으로 메뉴의 이름이 바뀌어야 하는데 정작 게시판 모듈에서 작업을 진행하기 때문에 이름이 변하지 않는군요. 이러한 부분의 해결은 다음 장 "회원을 위한 특별한 모듈"에서 공부해 봅니다.