본문으로 바로가기
티스토리 심플 스킨 만들기...초보 블로거 학습기

티스토리에 들어서 두번째 스킨작업이네요.

거창하게 스킨 작업이라 할건 없이 단순 수정작업입니다.
하지만, 저와 같은 초보블로거 분들....
스킨 수정에 두려움(?)을 갖고 계신분들을 위해 오랜만에 "초보블로거 학습기"를 적어봅니다.

처음 시작부터 심플한 스킨에 맘을 두고 있었는데, 실력이 뒷받침 되지 않아 마음만 갖고 있었습니다.
하지만, 1차 스킨 작업시 티스토리 블로그 구조에 대해 대충 감을 보게 되었지요.
사이드바가 어떻게 만들어 지는지도 알게 되었구요.


▶ 1차 스킨 변경    : http://www.kidory.net/62
▶ 사이드바 만들기 : http://www.kidory.net/70
▶ 티스토리 절대경로 활용하기 : http://www.kidory.net/91


위 세 포스팅을 하면서 알게된 초보적인 지식을 공유 하고자 합니다.



현재 사용중인 심플 스킨입니다.

원작자는 용의자님[심플 3단 스킨] 입니다.

개인적으로 이름을 "Black Dog"이라 부르고 있구요..^^;
첫번째 스킨 수정시보다 더 많은 기교(?)가 포함되어 있답니다.

★★ 초보 블로거 학습기 ★★


초보 블로거가 skin.html / style.css 파을을 처음부터 끝까지 완성하기란 사실상 불가능하죠~?
때문에 전체적인 스타일이 자기와 맞는 공개된 스킨을 하나 붙잡고 수정작업을 시작합니다.

처음 스킨을 접하게 되면 무수히 많은 알파벳(?)만 보이게 됩니다.
보기만 해도 눈이 @_@ 어질어질하죠~^^?

하지만, 우린 두려울게 없는 초보 블로거 입니다~!!!

다른건 다 필요없고, <div id="     "> 요부분만 보면 됩니다.
이미 공개된 스킨은 완성된 스킨입니다. 잘 돌아가는 스킨을 원하는 스타일로 수정만 하기 때문에,
"div id" 값만 알면 됩니다.

대부분의 스킨 제작자 분들은 id 값을 연관된 단어로 만들어 주십니다.
예를들자면, "menu", "header", "comment" 등 알만한 단어들입니다.

skin.html 을 뚫어져라 보게되면, 한글 주석도 많이 달려 있어 더욱 찾기 쉽습니다.
수정하고자 하는곳.
예를들어 상단 메뉴바의 색상을 바꾸고자 한다면, 상단 메뉴에 해당하는 id 값을 찾습니다.


위의 소스에서 보듯이 상단메뉴의 id 값은 menu 라는것을 알수 있습니다.
그럼 menu를 style.css 파일에서 찾아보면


위와같이 단순한 소스가 나타납니다.
#25241d 값은 현재 사용중인 메뉴의 색인 검은색을 나타냅니다.
width 값은 전체 가로 사이즈를 정해주고요.

css의 경우 초보블로거가 수정하기에는 어려운면이 많습니다.
하지만, 색을 바꾸는것부터 시작하면, 여러가지 기교(?)를 부릴수 있게 됩니다.

id값에 해당하는 css 를 찾은후, 써있는 명령어들을 검색창에 찾아보면, 어떤 역할을 하는지 상세히 설명해주시는 많은 블로거 분들이 계십니다.




처음 블로그를 접하고,
처음 스킨을 원하는 형태로 꾸며보고자 하시는 분들을 위한 글이었습니다.