CODELAB

코드랩은 디자인과 코드 뿐만 아니라 다양한 생각을 공유하며 소통하고, 여러가지 기회도 만들어보고, 공부도 하려는 목적으로 시작된 '2인 아이디어 동아리'입니다.



티스토리 스킨 '봄나무'(베타버전)를 분양합니다. 

- 본 팀블로그 구성원인 구름강아지의 개인블로그 "인생학개론"에 사용된 스킨을 다듬어 만들었습니다.

- 크롬을 통해 제작하였고, 익스플로러는 9버전 이상에서 정상적으로 작동되는 것을 확인했습니다.

- 봄나무 스킨은 비반응형 데스크톱 전용입니다.

- 소셜댓글 디스커스와 관련된 소스가 스킨파일에 이미 포함되어 있으니, 필요할 경우 간단한 변경을 통해 사용할 수 있습니다.

- 그 외에 Google Analytics, Syntaxhighlighter 등 은 미포함 되어 있습니다. 모두 미포함되어 있으니 필요할 경우 직접 추가하여 사용하시면 됩니다.

- 스킨 미리보기 http://skincenter2.tistory.com

- 원작 : http://moksunung.com

- 원작 페이지에 본 스킨을 적용하였습니다. 스킨 미리보기는 아래 주소로 들어오시면 됩니다.

· http://moksunung.com


사용법

1. 일반적으로 티스토리 스킨을 적용하는 방법과 동일한 방법으로 적용합니다.

2. 사용자 맞춤화 작업이 필요합니다. (*중요, *필수)

- 티스토리 스킨을 블로그에 적용하고, 관리자페이지에서 [꾸미기] > [HTML/CSS 편집] 메뉴로 들어갑니다.

- 우측 소스창에서 [HTML]탭을 들어갑니다.

- '[Ctrl] + F'를 눌러 검색폼을 열고, "사용자정의"로 검색합니다.

· 첫번째 검색되는 부분에서 본인이 사용할 SNS 아이콘을 최대 4개까지 주석을 제거하고, SNS 주소를 본인 SNS 주소로 변경합니다.

- 다시 '[Ctrl] + F'를 눌러 검색폼을 열고, "사용자정의"로 검색합니다. 

· 두번째 검색되는 부분은 소셜댓글 디스커스를 사용하고자 하는 분만 주석의 안내에 따릅니다. 

- 또 다시 '[Ctrl] + F'를 눌러 검색폼을 열고, "사용자정의"로 검색합니다. 

· 세번째 검색되는 부분도 소셜댓글 디스커스를 사용하고자 하는 분만 주석의 안내에 따릅니다.

- 마지막으로 '[Ctrl] + F'를 눌러 검색폼을 열고, "사용자정의"로 검색합니다. 

· 네번째 검색되는 부분에서 주석의 안내에 따라 본인의 블로그 주소를 기입합니다.

3. 관리자 페이지 설정 (*중요, *필수)

관리자페에지에서 [꾸미기] > [환경설정] 으로 들어가 [화면출력] 탭으로 이동하여 아래 그림처럼 '선택 화면' 항목의 마지막을 "목록만"으로 설정하고 저장합니다. 만약 '목록만'으로 설정하지 않으면, 블로그에 여러 글이 한 화면이 보여지지만, 제일 윗글만 댓글기능이 작동됩니다. 



※ 참고 : 스크립트와 CSS파일은 대부분 압축되어 있습니다. 만일 스킨을 수정하고자 할 경우, 비 압축파일이 images 폴더에 포함되어 있으니 파일명으로 대조하여 필요시 이용하시면 됩니다.


안내

- 스킨 사용으로 발생하는 모든 문제의 책임은 사용자 본인에게 있습니다.

- 수정 및 재배포가 가능하지만 포함된 소스를 판매할 수 없고, 하단 Codelab 관련된 어떤한 내용도 삭제하여서는 안됩니다.


스킨 다운로드

Bomnamu.ver.beta.zip


기타 문의

- 문의사항을 본 게시물에 댓글로 달아주시면, 여유가 되는대로 답변드리겠습니다.


알려진오류

1. 스킨 적용시 하단부에 제작자의 페이스북 주소가 링크되어 있습니다. (본의 아니게...) 수정하여 사용하시기 바랍니다.

티스토리 스킨을 블로그에 적용하고, 관리자페이지에서 [꾸미기] > [HTML/CSS 편집] 메뉴로 들어갑니다.

· 우측 소스창에서 [HTML]탭을 들어갑니다.

· '[Ctrl] + F'를 눌러 검색폼을 열고, "블로거"로 검색합니다.

· 근처에서 "http://www.facebook.com/moksunung" 으로 되어 있는 부분을 찾아 본인의 링크 주소로 수정합니다.

2. HTML 소스에 'ㅂ'문자가 잘못 들어갔다는 내용 확인해보니, 정상적인 것으로 확인.


응원의 댓글은 열정을 채우는 원동력이 됩니다. 많이 응원해주세요!!


  1. 이거 너무 예쁜데요. 기능들도 화려하고요. 유료 스킨들 다 기죽겠어요. ^_^;
    1. 감사합니다.^^
  2. 일단 시험삼아 스킨 시험용 블로그에 적용시켜보았는데, 참 예쁘네요. 감사합니다.
    1. 감사합니다.^^
  3. 뭔가 눈의 피로를 줄여줄것같은 느낌이네요.
    지금 최적화해서 운영하는 스킨이 있어서 적용은 어렵지만
    좋은 스킨 하나 알고 가네요.
    1. 감사합니다.^^
  4. 잘만드셨네요. 전 퍼블리셔라 코딩하는건 어느정도 하겠는데 디자인이 문제에요 ㅋㅋㅋ
    1. 오랫만에 뵙네요. 칭찬 감사합니다^^
  5. 회신 남겨주셔서 너무 감사합니다!! 덕분에 좋은 스킨 사용하게 되어서 너무 좋습니다 ㅎㅎ
  6. 비밀댓글입니다
    1. 저 비읍은 뭐죠...? T_T 감사합니다!
    2. 제가 다운받아서 확인해보니, 정상적인 것으로 보이네요. 아마 호롤룰리님이 적용하실 때 잘못들어가진 문제가 아닐까요?
    3. 헐... 그러신가요... ㅠㅠ.. 전 사용자 정의만 변경하다가 발견했는데,, 그랬다면.. 죄송합니다 ㅠ
    4. 아니에요! 죄송하다니요 오히려 감사합니다!^^
  7. 응원합니다!! 추천 꽊!
    1. 응원 감사합니다^^*
  8. http://tvstarnews.tistory.com/ 블로그를 만들어서 테스트겸
    화면에 적용하였습니다,. 메인화면에 여러개의 글을 노출되게 하는건 별도로없고
    해당페이지 노출만되는건가요^^?
    구름강아지님의 적용 블로그를 보면 최신글들 노출이 되어있는데 아니면 별다른 설정이 있는건지 궁금합니다.
    1. 인생학개론 메인페이지는 티에디션 이라는 티스토리 기능을 별도로 사용해서 디자인한 겁니다. 배포스킨에는 그냥 블로그 기본 설정에 대한 디자인 소스만 있어요! 티에디션 설정법과 디자인은 시간이 나는대로 정리해서 올려드리겠습니다^^
    2. 아 그러셨군요 답변감사합니다.^^! 좋은하루되세요
  9. 와 정말 스킨 이뻐요 ^^ 사용해도 되는건가요 ?
    1. 그럼 그럼요 써주시면 좋죠!! ㅎㅎ 감사합니다!^^
  10. 모바일이 안되는점 안타깝네요.
    1. 저도 그점이 안타깝네요 ㅜㅜ
    2. 모바일도 빨리됬으면 합니다
  11. 와! 정말 예뻐요 좋은 자료 감사합니다
  12. 이 블로그에 사용중인 스킨은 이용못하는건가요?
  13. 예뻐서 받아갑니다.
    비공개블로그가 하나있는데 적용해놓았어요.
    고마워요.
  14. 좋은스킨 감사합니다 ~!
  15. 후...훌륭합니다... 당장바꾸러갑니다^^
  16. 정말 예뻐요!!! 예쁜스킨 잘쓰겠습니다 감사합니다~~
  17. 감사합니다. 잘 사용하겠습니다.!!
  18. 비밀댓글입니다
  19. 어렵당
    카테고리 펼침 모드로 쓰고 싶은데 뭘 바꾸면 되나요?

    그리고 애드센스 사이드바 광고를 넣는데 위에 메뉴에 딱 붙더라구요. [플러그인] 빈줄표시 도 넣어 봤는데 안먹는데 해결 방법 좀 알수 있을까요?

    사이드바, 티스토리에서 제공하는 사이드바 플러그인 HTML 배너출력은 애드센스로 광고 넣으면 기존 메뉴와 곁침 현상이 있네요.
    광고 두개를 넣으면 광고1광고2메뉴 3개 곁치네요.
    skin, html에서 수동으로 추가해서 넣으면 크롬은 정상적으로 나오는데..
    ie,엣지는 똑같이 곁침현상이 있어요

    너무 어렵네여 ㅠ

작성완료