스킨정보파일 작성 예
<?xml version="1.0" encoding="UTF-8"?> <layout version="0.2"> <title xml:lang="ko">나의 레이아웃</title> <title xml:lang="en">My laytout</title> <description xml:lang="ko"> 나의 첫번째 레이아웃입니다. Author : phiz </description> <description xml:lang="en"> It's My first layout. Author : phiz </description> <version>1.0</version> <date>2017-01-21</date> <link>http://phiz.kr/</link> <author email_address="phiz@phiz.kr" link="http://phiz.kr/"> <name xml:lang="ko">phiz</name> <name xml:lang="en">phiz</name> </author> <extra_vars> </extra_vars> <menus> <menu name="main_menu" maxdepth="3" default="true"> <title xml:lang="ko">상단 메뉴</title> <title xml:lang="en">Top menu</title> </menu> </menus> </layout>
코드 | 설명 |
---|---|
<?xml version="1.0" encoding="UTF-8"?> | xml 문서형식선언 |
<layout version="0.2"> | 레이아웃 정보문서임을 선언. 여기에 작성하는 버전은 XE Core에서 지원하는 버전을 표기해야하며 XE 1.4.4.2 이후 0.2입니다. |
<title xml:lang="ko">...</title> | 레이아웃 이름. |
<description xml:lang="ko">...</description> | 레이아웃 설명 |
<version>...</version> | 레이아웃 스킨의 버전. 레이아웃이 변경됨에 따라 제작자 버전을 표기합니다. |
<date>YYYY-MM-DD</date> | 레이아웃 스킨 제작 날짜. 년-월-일(YYYY-MM-DD) 형식으로 작성합니다. |
<author email_address="..."link="..."> <name xml:lang="ko">...</name> |
레이아웃 스킨 제작자 정보. 이메일 주소, 웹 사이트 주소,제작자 이름을 작성합니다. |
<menus> </menus> |
XE 관리자 페이지의 제어판에서 생성한 메뉴를 레이아웃에 연결합니다. <menus>...</menus> 요소 안에 2 개 이상의 <menu>...</menu>를 작성할 수 있습니다. |
<extra_vars>...</extra_vars> |
확장변수. <extra_vars> 요소안에 여러타입의 사용자 정의 변수를 추가할 수 있습니다. 레이아웃 설정에서 select, image, text, textarea 타입의 데이터를 입력받아 레이아웃 스킨에서 변수로 사용할 수 있습니다. |
확장변수 작성 예
<?xml version="1.0" encoding="UTF-8"?> <layout version="0.2"> ... <extra_vars> <var name="colorset" type="select"> <title xml:lang="ko">컬러셋</title> <description xml:lang="ko">원하는 컬러셋을 선택해주세요.</description> <options value="black"> <title xml:lang="ko">Black (기본)</title> </options> <options value="white"> <title xml:lang="ko">White</title> </options> </var> <var name="logo_image" type="image"> <title xml:lang="ko">로고 이미지</title> <description xml:lang="ko">페이지 상단에 출력할 로고이미지를 입력하세요.</description> </var> <var name="logo_url" type="text"> <title xml:lang="ko">로고 이미지 링크</title> <description xml:lang="ko">로고 이미지를 클릭할 때 이동할 URL을 입력해 주세요.</description> </var> <var name="title_description" type="textarea"> <title xml:lang="ko">본문 상단 내용</title> <description xml:lang="ko">본문 상단에 표시되는 영역의 내용을 입력해주세요.(HTML 사용가능)</description> </var> </extra_vars> ... </layout>
코드 | 설명 |
---|---|
<extra_vars>...</extra_vars> |
확장변수 컨테이너. 이 요소 안에 확장변수를 정의합니다. 확장변수는 <group></group>요소로 그룹으로 나누어 작성할 수 있습니다. |
<var name="colorset" type="select"> <title xml:lang="ko">컬러셋</title> <description xml:lang="ko">원하는 컬러셋을 선택해주세요.</description> <options value="black"> <title xml:lang="ko">Black (기본)</title> </options> <options value="white"> <title xml:lang="ko">White</title> </options> </var> |
확장변수 이름은 "colorset"이라 명명했으며, select type입니다. 여기서 option은 "black"과 "white"입니다. 레이아웃 스킨에서 {$layout_info->colorset}의 형태로 출력할 수 있습니다. 레이아웃 스킨에서 다음과 같이 사용할 수 있습니다. <!--@if($layout_info->colorset == "white")--> <load target="css/white.css" /> <!--@else--> <load target="css/black.css" /> <!--@end--> 레이아웃 설정에서 colorset를 "white"를 선택했으면 white.css를 "black"를 선택했으면 black.css를 참조하게 하여 다른 디자인을 출력할 수 있습니다. * 위 구문에 사용된 if문과 load문은 xe 템플릿 문법으로 xe에서만 사용하는 코드입니다.(xe 템플릿 문법 참조) |
<var name="logo_image" type="image"> <title xml:lang="ko">로고 이미지</title> <description xml:lang="ko">페이지 상단에 출력할 로고이미지를 입력하세요.</description> </var> |
확장변수 이름은 "logo_image"이며 image type입니다. 레이아웃 설정에서 이미지를 업로드할 수 있으며 업로드한 이미지는 {$layout_info->logo_image}로 출력할 수 있습니다. 레이아웃 설정에서 다음과 같이 활용합니다. <a class="logo-image" href="{$layout_info->logo_url}" ><img src="{$layout_info->logo_image}" alt="" /></a> |
<var name="logo_url" type="text"> <title xml:lang="ko">로고 이미지 링크</title> <description xml:lang="ko">로고 이미지를 클릭할 때 이동할 URL을 입력해 주세요.</description> </var> |
text type의 확장변수 {$layout_info->logo_url} 형식으로 출력 |
<var name="title_description" type="textarea"> <title xml:lang="ko">본문 상단 내용</title> <description xml:lang="ko">본문 상단에 표시되는 영역의 내용을 입력해주세요.(HTML 사용가능)</description> </var> |
textarea type의 확장변수 레이아웃에 위젯코드나 html코드 삽입 등에 유용합니다. |