서브메뉴

whiteBoard 2.0 for Textcube,Tistory

by hi8ar

Textcube를 위한 whiteBoard 스킨을 공개합니다.

whiteBoard_스킨미리보기

whiteBoard v2.0

쵸썰렁한 하얀 보드에 대문짝만하게 낙서하는 기분으로 사용하시면 좋습니다. :) 아름다운 낙서를 위해 다양한 색상의 마커펜을 제공.. 훗~ 처음에 생각했던 깔끔한 시안 이미지 는 안드로메다로~ 이것은 완전 난장 분위기~

History

  1. 2008.10.30 whiteBoard v1.0 공개
  2. 2008.10.31 whiteBoard v1.1 업데이트 - IE6 : 레이아웃보다 작은 크기의 창 사이즈일때 검색폼 배경 잘리는 문제 수정. http://hi8ar.net/entry/whiteBoard-for-Textcube#comment18650 
  3. 2008.11.1 whiteBoard v1.1 for 티스토리 공개
  4. 2008.11.2 whiteBoard v1.1 for 티스토리 업데이트 - 사이드바의 링크가 출력되지 않는 문제 수정.
  5. 2008.11.8 whiteBoard v2.0 / whiteBoard v2.0 for 티스토리 공개 - 작은 가로 해상도(1024px) 에서도 무리 없이 사용 할 수 있도록 수정된 버젼입니다.
  6. 2008.12.7 티스토리 버젼에서 페이지 타이틀 치환자 오류 수정
2.0 버젼에서 달라진 점
  • 변경된 파일 : index.xml, skin.html, layout.css, main.css, screen_ie6.css, preview.gif
  • 가로 해상도 1024px 에서도 한 화면에 가로 스크롤바 없이 출력, 그보다 큰 해상도에서는 가운데 정렬하도록 수정.
  • 사이드바 리스트 박스 클래스를 sidebarListBox 에서 listbox 로 수정. (사용자 편의를 위해, 플러그인 등에서 만드는 리스트 코드를 수정하지 않도록, 기본 스킨과 동일한 클래스명으로 수정했습니다.)
  • 방명록 textarea에서 IE6의 경우, hover 효과가 나타나지 않던 문제 수정.
  • 본문 h3 Heading, 1px solid #ddd 밑줄 추가.
  • 사이드바에 200px 이상 되는 element를 추가해도 사이드바가 떨어지지 않도록 수정.
  • 불필요해진 IE_hack 제거.
  • 티스토리 버젼의 경우, IE에서 검색폼 동작하지 않던 문제 수정.
  • 그리고.. 기타 등등.. :)

적용 방법

  1. 다운 받은 zip 파일의 압축을 풉니다.
  2. 자신의 계정, 텍스트큐브 스킨 폴더에 FTP 등을 이용해서 업로드 합니다.
  3. 텍스트큐브 관리자 페이지, 꾸미기 - 스킨선택 에서 적용합니다.
  4. 스킨 상세 설정에서 자신의 블로그에 맞게 설정합니다.
  5. 참 쉽죠? :)

whiteBoard 스킨 정보

  • 본문 : 620px
  • 사이드바 : 200px
  • 이미지 리사이징 : 600px (index.xml)
  • 모니터 해상도가 가로크기 1280px 이상이 되어야 보기 좋지만 1024px 에서도 잘 나옵니다.
  • 기본 글꼴 : 이 스킨은 네이버에서 배포하는 나눔고딕  글꼴을 기본으로 사용합니다. (font-family: NanumGothic, 나눔고딕, "Malgun Gothic", "맑은 고딕", "Lucida Grande", "Segoe UI", Arial, AppleGothic, Sans-serif; )
  • 텍스트 큐브 1.7.6 버젼에서 테스트 했습니다. 달력을 제외한 대부분의 텍스트 큐브 최신(?) 기능을 지원합니다.
  • 텍스트 큐브 1.7.5 이하 버젼에서 사용시, bodyID 한 곳을 수정하셔야 합니다. main.css 28라인

/* ####### body ID 를 이용한 현재 페이지 표시 ####### */ body#tt-body-pages #navMeta a { background-position: 0 -40px; }

위 코드 부분에서 body#tt-body-pages 를 body#tt-body-page 로 수정하셔야 블로그 처음 페이지 일때 home 탭이 활성화 되어 현재 페이지로 표시 됩니다. 이는 텍스트큐브 1.7.6 에서 notice 를 대신할 수 있는 page 기능이 강화 되면서, 기본 페이지의 body ID 가 변경되었기 때문입니다.

whiteBoard 스킨 특징

  • XHTML 1.0 Transitional
  • CSS 2.1
  • 웹표준 준수, Firefox 3.0, Safari 3.1, Opera 9.5, IE 6.0 ~ 7.0, GoogleChrome 크로스 브라우징.
  • 영역별 css 분리 코딩.
  • 쉬운 사용자 컬러 테마 변경. :)
  • IE를 위한 css hack 분리.
  • 과도하게 남발한(?) 주석 :)
  • print.css 와 wysiwyg.css 포함.
  • 나눔고딕 글꼴이 설치되지 않은 시스템에서 볼때엔 상당히 구림.. =_='

저작권

  • 공개된 리소스를 제외한 대부분의 권리는 hi8ar.net에 있습니다.
  • 영리/상업적 이용을 하실 수 없습니다.
  • 광고만을 위한 스팸 블로그에선 사용하실 수 없습니다.
  • 개인적인 이용시 자유롭게 수정이 가능합니다. 다만 수정시 원 제작자를 표시하여야 합니다.
  • 특별한 경우가 아닌 이상 다음 링크의 라이센스에 따릅니다. :) http://creativecommons.org/licenses/by-nc-sa/2.0/kr/ 

사용자 컬러 테마 theme.css

css에서 스킨의 기본 색상을 따로 분리해서 하나의 문서에 담았습니다. (과장 쵸큼 보태서..) 아아아~ 카멜레온 처럼 변하는 당신의 블로그는 일곱 빛깔 무지개~~ 훗, 워낙에 배경이 허멀건한 것밖에 없다 보니, 색상 하나만 바꿔도 새로운 분위기~ :) 좋아하는 색상의 마커펜을 사용한다는 기분으로~

  1. theme.css 를 사용하는 텍스트 에디터로 엽니다.
  2. 배포되는 theme.css 에 지정되어 있는 기본 컬러는 1번, 빛바랜 빨강색 마커펜 #966 입니다.
  3. 사용하는 에디터의 찾기/바꾸기 기능을 이용해서, 좋아하는 색상의 컬러값으로 바꿔 줍니다.
  4. 수정한 theme.css 를 다시 업로드 하셔서 덮어쓰시면, ok~
  5. 추천하는 색상. 파스텔 톤의 은은한 색상이 잘 어울립니다.
  6. 아래는 제가 미리 수정해서 올려둔 예제 입니다. 파일명을 theme.css로 수정하시고 css 폴더에 덮어 쓰시면 됩니다. 싫증이 났거나, 분위기 변화를 주고 싶을때 언제든 교체해 보세요~!

샘플 예제 Download

기타 알림사항

Download for Textcube

Download for Tistory

감사합니다. :)

2008/11/09 01:54 2008/11/09 01:54
Rated 4.52/5 (90.48%) (21 Votes)
2개의 걸린 글 과    31개의 댓글이 있습니다.
이 글의 댓글/트랙백 RSS : http://www.textcube.org/theme/rss/response/850
이 글의 관련글(트랙백) 주소 : http://www.textcube.org/theme/trackback/850
  • Tracked from : 생각하는 덩어리의 개념있는 블러그 2009/11/16 21:22 DELETE
    Subject : 11-16

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <!-- ========================================================= whiteBoard v2.0 for Tist..

  • Tracked from : 생각하는 덩어리의 개념있는 블러그 2009/11/16 21:40 DELETE
    Subject : whiteBoard_스크랩

    whiteBoard_v20_tistory_title수정판.zip whiteBoard v2.0 쵸썰렁한 하얀 보드에 대문짝만하게 낙서하는 기분으로 사용하시면 좋습니다. :) 아름다운 낙서를 위해 다양한 색상의 마커펜을 제공.. 훗~ 처음에 생각했던 깔끔한 시안 이미지 는 안드로메다로~ 이것은 완전 난장 분위기~ History 2008.10.30 whiteBoard v1.0 공개 2008.10.31 whiteBoard v1.1 업데이트 - IE6 : 레..