티스토리 스킨만들기 - 스킨 정보파일 index.xml

서론

티스토리 스킨을 만들면 index.xml이라는 문서가 존재합니다. 

본문에서는 이 index.xml이 어떤 역할을 하고, 어떤 구조로 이루어져 있는지 알아보도록 합시다.

 

index.xml의 역할

index.xml 문서는 당연히 XML문법을 통해서 작성된 문서입니다. 효과적으로 데이터를 전달하기 위한 문법이죠.

다양한 태그들을 통해 제공되며 형식에 맞게 문법을 작성하면 아래와 같은 기능을 쉽게 사용할 수 있게 됩니다.

 

• 기본 정보들을 작성 및 제공해줍니다.

• 스킨을 통해 블로그를 제어할 기본 설정 값을 설정할 수 있습니다.

예를 들어 카테고리의 글자 색, 배경 색, 표시되는 글자의 수 댓글란을 활성화시킬지 여부 등등의 기본 정보를 입력할 수 있습니다.

• 홈 커버를 설정할 수 있습니다.
• 다양한 스킨 옵션을 설정할 수 있습니다.
• 리스트 스타일을 설정할 수 있습니다.

기본 정보 - <information>

이 태그를 통해 블로그의 기본 정보를 설정합니다.

안에 사용하는 태그는 다음과 같습니다.

	<information>
		<name>스킨의 이름</name>
		<version>스킨의 버전</version>
		<description>설명</description>
		<license>저작권</license>
	</information>

제작 정보 - <author>

이 태그를 통해 제작 정보를 삽입할 수 있습니다.

	<author>
		<name>제작자</name>
		<homepage>제작자의 웹사이트 주소</homepage>
		<email>이메일 주소</email>
	</author>

기본 설정값 - <default>

이 태그를 통해 스킨의 기본 설정을 제어할 수 있습니다.

	<default>
		<recentEntries>사이드바 최근글 표시 수</recentEntries>
		<recentComments>사이드바 최근 댓글 표시 수</recentComments>
		<recentTrackbacks>사이드바 최근 트랙백 표시 수</recentTrackbacks>
		<itemsOnGuestbook>한 페이지에 표시될 방명록 수</itemsOnGuestbook>
		<tagsInCloud>사이드바에 표시될 방명록 수</tagsInCloud>
		<sortInCloud>태그 클라우드 표현 방식 (1:인기도순, 2:이름순, 3:랜덤) </sortInCloud>
		<expandComment>댓글영역 표현 방식 (0:감추기, 1:펼치기) </expandComment>
		<lengthOfRecentNotice>최근 공지 글자 표시 수</lengthOfRecentNotice>
		<lengthOfRecentEntry>최근 글 글자 표시 수</lengthOfRecentEntry>
		<lengthOfRecentComment>최근 댓글에 표시 글자 수</lengthOfRecentComment>
		<lengthOfRecentTrackback>최근 트랙백에 표시 글자 수</lengthOfRecentTrackback>
		<lengthOfLink>링크에 표시 글자 수</lengthOfLink>
		<entriesOnPage>홈 화면 글자 수</entriesOnPage>
		<entriesOnList>글 목록 수</entriesOnList>
		<showListOnCategory>커버 미사용 홈에서 글 목록 표현(0:내용만, 1:목록만, 2: 내용+목록) </showListOnCategory>
		<showListLock >홈 설정과 기본 설정에서 '목록 구성 요소' 항목의 노출 여부 결정 (0: 노출, 1: 노출 안 함)</showListLock >
		<tree>카테고리
        	<color>글의 색</color>
			<bgColor>배경 색</bgColor>
			<activeColor>선택 시 색</activeColor>
			<activeBgColor>선택 시 배경 색</activeBgColor>
			<labelLength>카테고리 표시 글의 갯수</labelLength>
            <showValue>카테고리 표시 할 글자 수</showValue>
            <contentWidth>콘텐츠 영역의 가로 사이즈</contentWidth>
        </tree>
	</default>

홈 커버 - <cover>

이 태그를 이용해서 커버의 형태를 여러 개 만들어서 배포할 수 있습니다.

홈 커버 옵션을 다양하게 만들고 싶으면 이 부분에서 정의해 주어야 합니다.

<cover>
		<item>
			<name>1번째 옵션 커버의 이름</name>
			<label>
				1번째 옵션 커버의 라벨
			</label>
			<description>
				1번째 옵션 커버의 설명
			</description>
		</item>
		<item>
			<name>2번째 옵션 커버의 이름</name>
			<label>
				2번째 옵션 커버의 라벨
			</label>
			<description>
				2번째 옵션 커버의 이름
			</description>
		</item>
	</cover>

리스트 스타일 - <liststyle>

이 태그 또한 홈 커버와 유사하게 리스트를 다양한 스타일을 사용할 수 있게 정의할 수 있습니다.

<liststyle>
		<item>
			<label>
				표시할 이름
			</label>
			<value>
				사용될 값
			</value>
		</item>
		<item>
			<label>
				표시할 이름
			</label>
			<value>
				사용될 값
			</value>
		</item>
	</liststyle>

추가 옵션 - <variables>

해당 태그를 통해서 추가적으로 스킨에서 사용할 데이터들을 추가할 수 있습니다.

예를 들어 블로그를 대표할 이미지에 대한 정보, 또는 특정 버튼들을 눌렀을 때 링크를 설정해주거나, 

블로그 전체의 색감을 설정하는 등의 옵션을 지정해 줄 수 있습니다.

​

<variables>
		<variable>
			<name>옵션 이름</name>
			<label>표시되는 옵션 이름</label>
			<description>설명</description>
			<type> 타입으로 5가지 종류가 있습니다.
            	<string>문자 입력</string>
                <select>선택 </select>
                <image>이미지 삽입</image>
                <bool>참 또는 거짓</bool>
                <color>컬러 값</color>
            </type>
			<option></option>
			<default></default>
		</variable>
	</variables>​

단, type이 select인 경우 <option> 태그에서 각각의 선택지마다 어떤 데이터를 사용할지 정의해 주어야 합니다.

		<variable>
			<name>colorSet</name>
			<label>컬러셋</label>
			<description></description>
			<type>SELECT</type>
			<option>
				<![CDATA[
				[
					{"name":"theme_pink", "label":"핑크", "value":"theme_pink"},
					{"name":"theme_blue", "label":"블루", "value":"theme_blue"},
					{"name":"theme_green", "label":"그린", "value":"theme_green"},
					{"name":"theme_gray", "label":"그레이", "value":"theme_gray"}
				]
			]]>
			</option>
			<default>theme_pink</default>
		</variable>