[Skin I] 티스토리 스킨 배포 Orchid I

[목차(도우미)]
이전에는 스킨을 공개해서 배포했지만 2012년2월1일부로 더이상 배포하지 않습니다. 사용하기를 원하시는 분은 댓글을 남겨 주시기 바랍니다.

Orchid I 특징

  • 자동목차를 사용
  • 사용자정의 스타일의 사용
  • 인쇄용 스타일을 사용하여 인쇄시 본문만 인쇄
  • 제목에 text-shadow CSS속성을 사용하여 IE에서는 효과가 안보일수 있음
관련된 내 블로그:
[블로그 관련] - HTML 문서에 자동으로 목차를 만드는 방법
[블로그 관련] - [메모] 블로그에서 쓰는 사용자 정의 스타일 사용법(style.css)
[블로그 관련] - 블로그 HTML을 PDF로 저장하는 방법
[블로그 관련] - 블로그 인쇄용 스타일시트(CSS)에 관하여

Orchid I 화면

난초를 소재로 한 사진 블로그를 추구하다



 저작권의 제한 없이 제작자 이름 표시하에 사용할 수 있도록 공개합니다. 사용하실 때는 댓글을 남겨 주세요.

다운로드

날짜 Memo
ver1.0 11월19일 초판
ver1.1 11월22일 작은 수정과 글씨체를 한글에 맞게 재적용하였다. 그리고 문제가 되었던 user.css의 갱신 문제를 해결하는 우회책으로 style.css에 모두 통합하였다.
ver1.2 11월24일 zizim님의 지적으로 IE에서 image속성의 경계선이 나타나는 것을 해결하였다.
ver1.3 11월30일 FireFox에서 주석처리 버그를 고려하여 주석문을 변경하였다. "<!-- -->"의 주석이 "-"를 많이 써서 주석을 사용하면 파이어폭스는 주석이 끝나도 계속 주석문인것으로 판단해버리는 버그가 있었다. "-"를 쓰지 않고 "^"로 주석문의 경계를 변경하였다. 이를 위해 파이어폭스를 설치해 보고 테스트하였다.

설치방법

  1. 스킨을 다운로드하여 압축파일을 풉니다.
  2. 새스킨 등록화면에서 파일을 모두 업로드합니다.
  3. 스킨이름을 부여합니다.

파일 설명

파일명
설명
skin.html
블로그의 골격이 되는 템플릿
style.css
블로그의 모양새를 결정하는 스타일시트
preview.gif
미리보기 이미지
index.xml
블로그의 선택사항을 저장한 파일
images/TOC.js
자동목차용 자바스크립트
images/*.png,*.jpg, *.gif
스타일시트에서 사용하는 배경 이미지
images/user.css ver1.0에서 사용한 스타일시트

Orchid스킨에 사용된 HTML/CSS의 구조도


스킨 제작에 사용한 툴

컴퓨터: 아이맥 호랑이
텍스트 편집기: Komodo Edit (무료버전)
브라우저: 오페라 10.1, 사파리 4.1.2
이미지 편집기: GIMP (무료)

Komodo Edit은 처음 사용한 편집기인데 스킨의 태그를 색상별로 표시한다는 점에서 좋은 툴이다. 다만 가끔 장애를일으켜서죽어버리기 때문에 자주 파일을 저장해야 한다. <s_ccccc>형태의 태그 블럭을 잘라내기하면 곧잘 컴퓨터가 중단된다.

by 금메달.아빠 on 2010.11.23 21:23 주요 단어: , , , , , , , , ,
  • BlogIcon 금메달.아빠 2010.11.19 01:30 신고 주소 수정/삭제 답글

    설치하려면 압축파일을 다운로드하여 저장한 다음에, 스킨을 새로 만드는 과정을 거치면 스킨 등록이 됩니다. 그리고 마음에 드는 설정을 변경합니다.

  • BlogIcon zizim 2010.11.24 08:33 주소 수정/삭제 답글

    티스토리 포럼에서 들렀습니다. 이곳 댓글창이 파폭에선 열리지 않아서 IE로 재접속합니다.
    이미지에 생기는 파란 테두리를 없애고 싶으시면 style.css 에 아래 줄을 추가하세요.
    img {border:0}

    • BlogIcon 금메달.아빠 2010.11.24 23:35 신고 주소 수정/삭제

      안녕하세요? 좋은 정보 감사합니다.
      파이어폭스에서 왜 댓글이 안되는지 파이어폭스는 사용해 본적이 없어서 시간을 두고 알아보아야 겠습니다.
      행복한 하루 되세요.

    • BlogIcon 금메달.아빠 2010.12.05 08:10 신고 주소 수정/삭제

      지금은 이미 파이어폭스의 버그를 모질라 재단에 신고하고 싶은 정도의 사소한 버그를 발견하였기에 회피책을 사용하여 스킨 수정했습니다. 한번 구경해 보시죠. 행복한 하루되세요.

    • BlogIcon hurr 2010.12.05 08:56 신고 주소 수정/삭제

      오오, 이제 여기서도 잘 작동하네요. 즐거운 휴일 되세요.

  • BlogIcon 이바구™ - 2010.12.03 07:19 신고 주소 수정/삭제 답글

    스킨이 깔끔해서 좋습니다.
    나중에 필요할지도 모르겠네요.

    • BlogIcon 금메달.아빠 2010.12.03 07:28 신고 주소 수정/삭제

      댓글 감사합니다. 건전한 의견교환을 환영합니다. 이번 제작에 재미를 들려서 앞으로도 스킨(테마)를 만들때마다 공개할 생각입니다.
      행복한 하루되세요.

  • 왼발오른발 2010.12.26 21:57 주소 수정/삭제 답글

    안녕하세요?
    스킨이 참 멋지네요.
    다운 받아서 쓰고 싶습니다.

    • BlogIcon 금메달.아빠 2010.12.27 00:09 신고 주소 수정/삭제

      안녕하세요?
      웹사이트 정보를 남겨 두지 않으셔서 방문하지 못했습니다만, 스킨이 마음에 드셨다니 반갑습니다. 마음놓고 쓰셔도 됩니다. 그리고, 이번 첫 스킨이 너무 인기가 없어서 다시 새로운 스킨을 만들려고 합니다. 저는 마음에 드는데 대중성이 없었나 봅니다.

      블로그 방문 감사합니다.

  • AA 2011.02.13 00:26 주소 수정/삭제 답글

    1.3버전 압축을 푸니 __MACOSX 폴더가 있고
    스킨 폴더, images 폴더에 .DS_Store 파일이 있던데
    필요한 파일들인가요?

    • BlogIcon 금메달.아빠 2011.02.13 00:44 신고 주소 수정/삭제

      필요없는 파일입니다.
      맥에서 압축파일을 만들어서 그런 파일들이 들어갑니다. 매킨토시에서는 USB메모리에 파일을 복사해도 그런 파일, 일종의 시스템 파일인데 윈도에서 본다면 미리보기 파일이 저장 되는 것과 비숫한 일입니다.

      결론 적으로 필요한 파일만 사용하고 "."으로 시작하는 파일은 무시해도 좋습니다. 행복한 하루되세요.

  • BlogIcon WetRat 2011.06.29 12:35 신고 주소 수정/삭제 답글

    스킨 감사합니다.
    정석적이면서도 깔끔하네요.
    제목이 난초인 만큼, 식물도감 블로그에 좋을 것 같습니다.
    2차 블로그에 적용시키고, 기술도 얻을 겸 받아갑니다.
    즐거운 하루 되세요!

  • BlogIcon 마쑤 2011.07.07 01:15 신고 주소 수정/삭제 답글

    안녕하세요
    블로그 스킨이 조금 이상해서 급하게 이스킨을 받아서 변경했습니다
    테스트 블로그에서 짧게 테스트만 하고 적용했는데
    잘만들어주신 덕분에 잘쓰게 되었습니다
    건의사항이 있다면 사이드바에 경계라인이 있었으면 어떨까 합니다
    사이드바등의 배색을 변경하려다 스킨바꾸느라 머리아퍼서 미루었습니다
    사용하다 궁금한점은 여쭈러 오겠습니다 감사합니다

    • BlogIcon 금메달.아빠 2011.07.09 11:46 신고 주소 수정/삭제

      안녕하세요? 잘쓰고 계시니 기쁩니다. 행복한 하루하루 되세요.
      그리고 사이드바의 어느 부분에 경계선이 필요하신가요? 경계선을 그리게 되면 배경색이 거슬리게 될 수도 있습니다. 나중에 방문하여 댓글을 남기겠습니다.

  • BlogIcon 오키드멜로디 2011.07.07 03:28 신고 주소 수정/삭제 답글

    안녕하세요.. 스킨을 바꾸고 싶었는데.. 잘 쓰겠습니다.. 감사 합니다..

    • BlogIcon 금메달.아빠 2011.07.09 11:48 신고 주소 수정/삭제

      안녕하세요?
      사용중이신 "Design by Blog Suspect // Reform by Lawlite"을 아이패드에서 보니 좌우 폭이 커져서 상대적으로 본문이 축소되어 보기 힘들었습니다. 잘쓰신다니 보고싶었는데, 기대해 보겠습니다.
      행복한 하루하루 되세요.

체크하면 비공개 댓글이 됩니다