이 블로그에서 쓰고 있는 스킨을 공개합니다.

현재 이 블로그에 적용하고 있는 스킨을 공개합니다. 제가 스킨을 직접 만드는 능력은 안되고, HTML/CSS 표준을 잘 아는 것도 아니고 해서 사실 기존 티스토리 스킨을 수정해서 사용하고 있습니다. 그래서 공개하기가 쑥스럽긴 합니다만, 요청하시는 분도 계시고, 본래의 스킨 자체가 수정/배포가 가능한 것으로 되어 있어서 공개를 하게 되었습니다.  

이 스킨은 티스토리에서 제공되는 Life Stand II(Brown) 스킨을 수정한 것입니다. 그리고 공개는 하지만 제가 스킨 제작/수정에 대한 전문적인 답변을 드리기는 어렵습니다. 따라서 혹시 스킨에 대한 질문에 대해서 답변을 못해드릴 수도 있음을 양해바랍니다. 
참고로 제가 HTML/CSS를 잘 모름에도 불구하고 블로그 스킨을 수정해서 사용할 수 있는 이유는 firebug라는 파이어폭스의 애드온 기능을 이용하기 때문입니다. Firebug는 파이어폭스 브라우저의 부가기능으로 제공되는 독립적인 Add-On 인데요. 이것을 파이어폭스에 설치하고 나면 웹페이지에서 마우스 오른쪽 버튼을 클릭하면 [요소검사]라는게 보이게 되는데 웹페이지의 특정 영역을 수정하려면 소스의 몇번째 줄을 수정해야 하는지를 알려주는 기능입니다. 보통 개발자들이 많이 쓰신다고 하는데 저는 블로그나 홈페이지의 스킨을 수정하는데 주로 사용합니다.
파이어폭스의 firebug 기능을 실행시킨 화면입니다. 왼쪽 아래에 있는 작은 버튼을 클릭한 후에 웹페이지 위에 마우스를 올리면 자동으로 테두리박스가 보여집니다. 수정하고 싶은 곳에 마우스를 올려놓은 후에 클릭하게 되면 오른쪽 하단에 소스가 보이게 됩니다. style.css의 몇번째줄의 #sidebar를 수정하라는 식으로 말이죠. 블로그 스킨을 수정하는데 애를 먹으시는 분들을 한번씩 이용해보시기 바랍니다. (당연히 파이어폭스 브라우저를 이용해야 합니다. 소스를 수정하는 편집기로 저는 EditPlus를 이용합니다.) 

ActionBasecamp 블로그에 적용된 스킨 다운로드
위 스킨을 다운받아서 압축을 푼 후에 티스토리의 [관리자화면] – [스킨] – [HTNL/CSS편집]에 들어가서 skin.html 과 style.css 파일은 메모장에서 연 후에 복사해서 붙여넣기 한 후 저장하고, 나머지 images/ 폴더 내에 있는 모든 파일들과 index.xml 파일, preview.gif 파일은 [파일업로드] 해주시면 됩니다. 
스킨을 적용하는데 있어서 몇가지 주의 할 점
#. 상단이미지 관련
맨 상단의 로고는 배경이미지로 지정되어 있습니다. 배경이미지 파일은 images/ 폴더 아래에 topbg_img.gif 파일을 수정해주시면 됩니다. 
#. 메뉴바 색깔 바꾸는 방법
상단메뉴가 있는 빨간색 배경을 바꾸고 싶으시면 images/ 폴더에 있는 menubar_bg.gif , menubar_bg_left.gif, menubar_bg_right.gif 파일을 수정해주시면 됩니다. 
#. 상단배경이미지에 링크거는 방법
상단배경이미지를 클릭했을 때 메인으로 이동시키기 위해서 투명이미지인 space.gif 파일을 위에 얹었다고 보시면 됩니다. 블로그 타이틀이 있는 영역만큼만 링크를 걸어주기 위해서는 style.css 에서 아래 소스를 찾으셔서 수정하시면 됩니다. 전체 배경이미지에서 왼쪽과 위쪽에서 몇픽셀, 가로와 세로 넓이는 몇픽셀을 링크로 걸어줄 것인지를 처리해주는 소스입니다. 

#header .blogTitle #logo_space { left:318px; top:80px; width:978px; height:81px; }

#. 상단메뉴를 수정하는 방법
skin.html 에 보시면 <!– 블로그의 메뉴에 맞게 메뉴이름과 링크를 수정하세요. –> 와 같은 문구가 있습니다. 그 아래에 있는 소스의 메뉴명과 링크주소를 수정해주시면 됩니다. 
#. 맨 하단 정보 수정하는 방법
skin.html 의 맨 하단에 “블로그 이름”이라고 표시된 부분을 수정해주시면 됩니다. 

이 블로그에서 쓰고 있는 스킨을 공개합니다.”에 대한 답글 7개

Add yours

  1. 항상 액션캠프 블로그에 올 때마다, 테마 참 좋구먼! 이런 생각을 하곤 했는데, 테마 공개하시는구먼요!

    1. 소스 보시면 아시겠지만 저도 다른 분 스킨 수정해서 만든거라서^^

  2. 멋진 스킨 잘쓰고 있습니다, 우선 감사드립니다. 궁금한게 있어 하나 여쭈어 볼려구요^^
    카테고리 폰트 색상을 어디부분을 수정해야 하는지 알고 싶네요. ~

  3. 초기 부터 이곳을 방문을 하여 많은 정보를 얻었습니다. 스킨도 간단하게라도 수정하여 함 써보려고 합니다. 감사합니다.

답글 남기기

아래 항목을 채우거나 오른쪽 아이콘 중 하나를 클릭하여 로그 인 하세요:

WordPress.com 로고

WordPress.com의 계정을 사용하여 댓글을 남깁니다. 로그아웃 /  변경 )

Google photo

Google의 계정을 사용하여 댓글을 남깁니다. 로그아웃 /  변경 )

Twitter 사진

Twitter의 계정을 사용하여 댓글을 남깁니다. 로그아웃 /  변경 )

Facebook 사진

Facebook의 계정을 사용하여 댓글을 남깁니다. 로그아웃 /  변경 )

%s에 연결하는 중

Create a website or blog at WordPress.com

위로 ↑