320x100
|
|
티스토리 스킨에 대해서 분석해보면서 자신의 블로그도 스킨을 수정할 수 있는 기술을 배워보도록 하겠습니다.
그 첫번째 시간으로 스킨을 수정할때 주의해야할 점과, 관리 , 수정하는 방법들을 설명합니다.
[잘못 쓰여진 글이 있거나 기술적으로 문제가 있는부분은 테클을 걸어주시면 감사하겠습니다. 수정을 받아들여 수정하겠습니다]
* 파일설명
티스토리 스킨은 테터툴즈에서 따온것이기 때문에 일정한 규격에 맞추어서 만들어져 있습니다.
skin.html - 뼈 골조가 되는 스킨파일
style.css - 살을 붙여주는 부분
* 스킨수정시 주의할 사항
티스토리 스킨 관리를 보면 Skin.html 과 Sytle.css 를 수정할 수 있습니다.
(티스토리 > 관리자 > 스킨 > HTML/CSS 편집)
보통의 경우 이 편집창을 뛰어놓고 여기에서 직접 내용을 추가하거나 빼거나 할겁니다. 하지만 그 방법보다는
전문 편집툴을 사용하는게 좋습니다.
# 전문편집툴을 이용할때의 장점
1. 코드를 정갈하게 잘 관리할 수 있다.
2. 따로 문서화해 둘 수 있다.
3. 추가 및 삭제를 했을때 정리가 되기때문에 다음에 다시 보더라도 쉽게 내용을 찾을 수 있다.
# 전문 편집툴을 이용한 수정 방법
1. skin.html 또는 style.css 내용을 모두 복사한다.
2. editplus 등의 전문 편집툴에 붙여넣기 후 편집을 한다.
3. 편집을 한뒤 수정된 내용을 복사를 한다.
4. 수정된 내용을 HTML/CSS 편집의 해당파일에 기존의 내용을 지우고 붙여넣기 한 뒤 저장한다.
* 스킨 수정시 지켜주어야 할 사항 (권장)
1. 그림을 뛰우는 부분은 style.css 에서 지정한다.
2. 태그입력시 대문자를 쓰지 않는다.
3. skin.html 에 따로 style 를 지정하지 않는다.
4. 치환자를 활용하자.
5. IE(Internet Explorer) 이외에 FF, Crom , Opera 등 에서도 작동을 하도록 가능한 javascript 는 피하자.
6. 주석을 잘 활용하자. 형식: <!-- 주석으로 쓰일 글 --> (뛰어쓰기 유의)
7. 들여쓰기를 꼭 하자.
8. XHTML 형식을 지켜서 태그를 열면 꼭 닫는다. 예: <strong></strong>, <img src="./image/test.png" border="0" alt="그림" />
#
티스토리 블로그 스킨 분석해보자 - 스킨수정 편에서는 실제 1개의 스킨을 설정하여 내용을 살펴보면서
설명드리도록 하겠습니다. (글작성중)
|
|
반응형
'유용한_팁 > 블로그_팁' 카테고리의 다른 글
블로그 방문자 늘리기 - 블로그 처음 시작 하기 (10) | 2009.09.06 |
---|---|
블로그 서식 꾸미기 #2 - 플래쉬 소제목 활용하기 (동영상) (81) | 2009.09.01 |
트위터카운터(Twittercounter)를 자신의 트위터로 바로 연결하기 (24) | 2009.08.31 |
티스토리 블로그 스킨 분석해보자 - 둘째편 (68) | 2009.07.23 |
블로그 광고 시스템 써보고 느낀 점 (52) | 2009.04.02 |
댓글