mindFULL.design :: skin manual for mindFULL.classic

이 스킨에 대해

mindFULL.design :: skin manual for mindFULL.classic

스킨 매뉴얼

2008/12/07 00:03, 글쓴이 mindFULL

다운로드

텍스트큐브용 / 티스토리용

업데이트

필수업데이트 [2008/12/13 16:55] version 1.01
공지사항 부분의 버그, 저작권 부분의 오류를 수정했습니다. 아랫쪽의 '자세한 업데이트 내역'을 참고해주세요.

이 스킨은...

mindFULL이란 이름을 달고 배포하는 첫 스킨입니다.

클래식한 느낌의 그레이톤의 무겁고 중후한 스킨입니다.
본문 너비는 610px입니다.

스킨 사용 주의사항

브라우저를 특별히 가리지 않습니다. IE6, IE7, Firefox 3(Mac), Opera 9.62(Mac), Safari 3(Mac)에서 테스트했습니다.
XHTML 1.0 strict 규격에 맞게 코딩하려 했으나, 몇몇 부분은 텍스트큐브 자체 구조 문제나, 플러그인 문제로 여의치 않았습니다.
완성한지 얼마 되지 않은 관계로 발견하지 못한 버그가 있을 수 있습니다.
버그를 발견하셨을 경우 으로 문의해주시거나 댓글을 달아주시면 시간이 나는대로 해결하겠습니다.

자세한 업데이트 내역

version 1.01
index.xml 다섯번째 줄 : <version>1.0</version>을 <version>1.01</version>로 수정
텍스트큐브용 skin.html 430번째 줄 ~ 445번째 줄 또는 티스토리용 skin.html 398번째 줄

<s_rct_notice>

<div class="element">

<h3><img src="./images/side_about.png" alt="이 블로그에 대해" /></h3>

<div class="elementContent">

<div class="imgWrap">

<img src="[##_image_##]" alt="logoImage" />

</div>

[##_desc_##]

<ul class="noticeElement">

<s_rct_notice_rep>

<li><a href="[##_notice_rep_link_##]">[##_notice_rep_title_##]</a></li>

</s_rct_notice_rep>

</ul>

</div>

</div>

</s_rct_notice>

를

<div class="element">

<h3><img src="./images/side_about.png" alt="이 블로그에 대해" /></h3>

<div class="elementContent">

<div class="imgWrap">

<img src="[##_image_##]" alt="logoImage" />

</div>

[##_desc_##]

<s_rct_notice>

<ul class="noticeElement">

<s_rct_notice_rep>

<li><a href="[##_notice_rep_link_##]">[##_notice_rep_title_##]</a></li>

</s_rct_notice_rep>

</ul>

</s_rct_notice>

</div>

</div>

으로 수정
텍스트큐브용 skin.html 523번째 줄 또는 티스토리용 skin.html 476번째 줄

<p><strong>Copyright &copy; by <a href="[##_blog_link_##]">[##_blogger_##]</a>, <a rel="license" href="http://creativecommons.org/licenses/by/3.0/">이 블로그의 내용물은 특별한 언급이 없을 시에 크리에이티브 커먼즈 &lt;저자 표시&gt; 3.0 라이센스에 준해 사용하실 수 있습니다.</a></strong></p>

을

로 수정

피드백 : 트랙백 없음 | 댓글 9 개

이 글에 대한 피드백 구독 : 트랙백+댓글 | 트랙백 | 댓글

이 글의 트랙백 주소: http://skin.zfbe.com/classic/trackback/1

푸른곰 @ 2008/12/12 23:27

받은 그대로 설치했는데 이런 상태입니다. 이미지가 전부 깨져버리네요
왜 이런걸까요?

http://purengom.com/owner/skin/preview/?skin=classic

--> 에 FTP 클라이언트 문제로 인하여 이미지가 제대로 올라가질 않았던것 같습니다. 문제 해결됐습니다. (수정)

coachkim @ 2008/12/13 22:16
제일 위에 로고 부분이 문제가 있습니다. 별의별 방법을 다 썻는데, 익스플로러에서는 아무이상이 없지만, 파이어폭스에서는 블로그,커버,위치로그 버튼들이 아래로 푹~ 내려가 버립니다. 즉..로고이미지파일이 삽입되니 메뉴가 밑으로 내려가 버린거죠
1. mindFULL @ 2008/12/14 01:37
  
  로고부분은 css 수정 및 여러 제반사항에 대한 팁이 필요해 '스킨 고치기' 메뉴에서 제가 커스터마이징 방법을 제공할 계획입니다. 머지 않은 시일 내에 필요한 배경이미지와 css 수정 가이드를 제공하겠습니다.
  
  로고 대신 이미지를 사용한 실례는 http://blog.zfbe.com 에서 확인하실 수 있습니다.

stella @ 2008/12/29 23:57

카테고리 부분에 제목옆에 ( ) 괄호안에 게시물 수 나타나는거요
이분이 잘리는데 어떻게 수정하면 되나요?ㅠ

더티문라 @ 2009/01/02 17:43

이 스킨을 티스토리에 적용하면 모든 이미지들이 엑박으로 적용됩니다.

어떻게해야 할까요 ...

kei @ 2009/01/03 01:33

본문 크기를 늘릴 순 없을까요 ㅜ_ㅜ 덧글 읽다보니 시간이 없으셔서
쉽게 손대지 못할거라시던데.. 아쉽네요. 모처럼 정말 마음에 드는 스킨이었는데

poohoot @ 2009/01/14 23:37

저도 모처럼 맘에 드는 스킨인데...
본문이 커지고 사이드바가 얇은 버전도있었으면 너무 좋겠습니다...

kal @ 2009/05/06 16:54

스킨이 맘에들어 설치했습니다.
사이드바에 최근글, 월별글, 카테고리 순으로 되어있는데요
월별글을 삭제하고 카테고리, 최근글 순으로 임의로 고쳐서 사용하여도 되나요?

그리고 트랙백 제목이 길면 댓글창이 좀 깨지는 현상이 있네요.. 이런것도 나중에 수정 가능할까요?

이키나! @ 2009/05/10 04:40

음...블로그 메뉴에 외부링크를 여러 추가하고 싶은데
그냥 추가하면 어울리지가 않을 것 같네요.
하는 방법이라던가 간단한 정보라도 가르쳐 주셨으면 합니다 ㅎㅎ

add

댓글 남기기

스킨 설치하기

mindFULL.design :: skin manual for mindFULL.classic

스킨 매뉴얼

2008/12/07 00:02, 글쓴이 mindFULL

1. 다운로드

먼저 스킨 패키지를 다운로드 받습니다.
텍스트큐브용 / 티스토리용

2.1 텍스트큐브용 : 업로드

받은 파일을 새로운 폴더를 만들어 압축을 풀고 FTP 프로그램을 이용, 스킨이 들어있는 폴더를 [(블로그 메인) - skin] 폴더에 업로드합니다.

2.2 티스토리용 : 업로드

① 받은 파일을 새로운 폴더를 만들어 압축을 풉니다.
② 티스토리 블로그 관리 페이지로 들어가신 다음, 스킨 메뉴의 스킨 선택 메뉴로 들어갑니다.
③ 제공 스킨, 저장한 스킨이라 써있는 탭 오른쪽에 있는 + 새 스킨 등록 버튼을 누른 후 스킨 저장명을 mindFULL.classic이라 적어주시고, 파일 업로드를 눌러 images 폴더 밖의 파일을 업로드합니다.
④ 파일 업로드를 다시 눌러 images 폴더의 모든 파일을 업로드합니다.

3. 적용하기

블로그 관리 페이지에서 스킨 메뉴로 들어가 올라간 스킨을 찾고, 적용 버튼을 누르면 스킨 설치가 완료됩니다.

피드백 : 트랙백 없음 | 댓글 없음

이 글에 대한 피드백 구독 : 트랙백+댓글 | 트랙백 | 댓글

이 글의 트랙백 주소: http://skin.zfbe.com/classic/trackback/2

add

댓글 남기기

스킨 고치기

mindFULL.design :: skin manual for mindFULL.classic

스킨 매뉴얼

2008/12/07 00:01, 글쓴이 mindFULL

먼저

파일을 수정하고 싶으시다면, EditPlus 등의 텍스트 에디터를 이용해주세요. 메모장은 살짝 불완전합니다. 물론, 간단한 수정은 메모장이나 태터툴즈 스킨 직접 편집(관리자 메뉴 - 스킨 - 스킨 편집)에서도 하실 수 있습니다.
이미지 파일은 포토샵 과 같은 프로그램을 이용해주시면 좋습니다.

이 매뉴얼은 1.0 / 텍스트큐브용 버전을 기준으로 작성되었습니다. 다른 버전 사용자분께서는 [찾기] 기능을 이용하셔서 비슷한 내용을 찾아가주세요.

본문, 전체 글꼴 바꾸기

이 스킨에서 굴림으로 보이는 부분은 모두 .gulim 클래스를, 돋움으로 보이는 부분은 .dotum 클래스를, Arial로 보이는 부분은 .arial 클래스를 이용한 부분입니다. 따라서 style.css의 이 세 부분만 교체하면 모든 글꼴 변경이 가능합니다.

여기서 Dotum,돋움 / Gulim,굴림 / Arial을 다른 폰트로 바꿔주면 (ex. '맑은 고딕') 폰트 변경이 가능합니다.

style.css line 47 ~ 50



body { font-family:Arial,'Lucida Grande',AppleGothic,Dotum,돋움,sans-serif; font-size:75%; text-align:center; margin:0; padding:0; line-height:1.5; color:#454545; background:url(images/b_entire.gif) repeat-x; }

.dotum { font-family:AppleGothic,Dotum,돋움,Arial,'Lucida Grande',sans-serif; }

.gulim { font-family:AppleGothic,Gulim,굴림,Arial,'Lucida Grande',sans-serif; } /* 굴림은 12px의 딱딱함을 위해 쓰는 것으로, 맥 환경에서는 AppleGothic이 더 의도하던 글꼴입니다.*/

.arial { font-family:Arial,'Lucida Grande',sans-serif; letter-spacing:0; }

예) 맑은 고딕으로 통일하고 싶은 경우

body { font-family:'맑은 고딕',Arial,'Lucida Grande',AppleGothic,Dotum,돋움,sans-serif; font-size:75%; text-align:center; margin:0; padding:0; line-height:1.5; color:#454545; background:url(images/b_entire.gif) repeat-x; }

.dotum { font-family:'맑은 고딕',AppleGothic,Arial,'Lucida Grande',sans-serif; }

.gulim { font-family:'맑은 고딕',AppleGothic,Arial,'Lucida Grande',sans-serif; } /* 굴림은 12px의 딱딱함을 위해 쓰는 것으로, 맥 환경에서는 AppleGothic이 더 의도하던 글꼴입니다.*/

.arial { font-family:'맑은 고딕','Lucida Grande',sans-serif; letter-spacing:0; }

스킨 폭 넓히기

이 스킨은 전체 너비가 950px인 스킨으로, 이 이상으로 스킨 폭을 넓힐 경우 1024px 해상도 환경에서는 스크롤바가 생기며, 배경이 이미지로 처리된 스킨이므로 쉽게 스킨 폭을 넓힐 방법이 없습니다.

사이드바 내용 순서/배치 수정하기

이 스킨은 태터툴즈 1.1 이상에서 제공하는 사이드바 기능(텍스트큐브 1.7 이후에서는 '위젯'으로 이름 변경됨)을 지원합니다. 따라서 간단한 드래그만으로도 오른쪽 메뉴를 재배치할 수 있습니다.

사이드바 설정을 하시려면, [관리자 메뉴 - 스킨 - 사이드바](티스토리, 텍스트큐브 1.6) 또는 [관리자 메뉴 - 꾸미기 - 위젯]으로 가주세요. 왼쪽에 두 칸, 오른쪽에 한칸으로 구성된 화면이 보일겁니다.

왼쪽은 블로그에 들어가지 않은 메뉴들의 모음이고, 오른쪽은 블로그에 들어간 메뉴들의 모음입니다. 구성요소를 드래그하여, 왼쪽에서 오른쪽으로 옮기면, 사이드바에 구성요소가 추가되고, 오른쪽에서 왼쪽으로 옮기면 사이드바 구성요소가 제거됩니다.

오른쪽에서는, 간단한 드래그를 통해, 전체적인 메뉴 순서를 바꿔놓을 수 있습니다. 예를 들면, 가장 아래의 링크를 가장 위로 올리고 싶다면, 맨 아래에 있는 링크 박스를 맨 위로 드래그해 옮기면 됩니다.

배너 달기

먼저, 배너를 달기 위해서는 플러그인에서 배너 출력 플러그인을 활성화하시고, 사이드바/위젯 편집(사이드바 내용 순서/배치 수정하기를 참고해주세요)을 하셔야합니다. 배너 출력 플러그인을 활성화하셨다면 왼쪽에 배너출력::CodeBanner 가 있는 게 보이실 겁니다. 이 플러그인을 적절한 위치(보통 가장 아래가 적절합니다)에 배치하시고, 편집을 누르신 후, 아래 형식으로 배너를 추가해줍니다.

보통 이미지 형태의 배너를 배포하는 곳과 비슷한 형식에 <ul>, <li> 정도만 추가한 형태이니, 비교해가시며 넣으시면 됩니다.

<div class="element">
<div class="elementContent">
<ul class="listElement">
<li><a href="(링크걸 주소 1)"><img src="(이미지 배너 주소 1)" alt="(이미지 설명 1)" /></a></li>
<li><a href="(링크걸 주소 2)"><img src="(이미지 배너 주소 2)" alt="(이미지 설명 2)" /></a></li>
(계속 넣으시려면 위 형식으로, <ul>과 </ul> 사이에 넣어주세요.)
</ul>
</div>
</div>

블로그 제목을 그림으로 바꾸기

준비중입니다.

이 이외에 궁금하신 것이 있을 경우

이 이외에 궁금하신 사항이 있으신 경우 skin at zfbe.com 에 물어보시거나 댓글로 물어보시면 얼마든지 답변해드리겠습니다.

피드백 : 트랙백 없음 | 댓글 14 개

이 글에 대한 피드백 구독 : 트랙백+댓글 | 트랙백 | 댓글

이 글의 트랙백 주소: http://skin.zfbe.com/classic/trackback/3

회색날개0E @ 2008/12/12 14:32
안녕하세요. 티스토리에서 텍스트큐브로 갈아타고 싶은 뉴비입니다.

아직 텍스트큐브는 한번도 써보지 못했지만 이 스킨이 참 마음에 드네요.
그런데 본문 폭 넓이는 좁은듯한데 사이드바의 넓이는 글씨체도 꽤나 작은데도 많은 공간을 차지하고 있다는 생각이 듭니다.
이부분에 대해서 수정을 할수 있는건지,? 아니면 수정할 생각이 있으신지 여쭤보고 싶네요.
1. mindFULL @ 2008/12/13 17:13
  
  죄송하지만 그 부분에 대해선 당분간 수정할 생각이 없습니다.
  
  일단 이 스킨에 대한 버그가 완전히 잡혀 수정 버전을 유지보수할 수 있을 때 다시 생각해보도록 하겠습니다.

비늘 @ 2008/12/12 17:59
로고그림이 바꿔도 수정되지 않고 엑박으로 뜹니다. 어딜 어떻게 손봐야 할지요?
1. mindFULL @ 2008/12/13 16:59
  
  문제를 패치해 다시 업로드했습니다. 죄송하지만 다시 다운로드해 패치해주십시오. 불편을 드려 죄송합니다.

와일드 @ 2008/12/13 15:05
사이드바의 폭을 좀 줄이기 위해서는 어떻게 해야 하나요?
알려주세요!
1. mindFULL @ 2008/12/13 17:00
  
  사이드바의 폭을 줄이려면 이미지 파일을 다수 수정해야 합니다. 요새 제 일정상 조금 힘들 듯싶습니다.
2. 와일드 @ 2008/12/14 09:48
  
  이미지파일까지 손이 가야하는군요!!
  그럼 우선 현상태로 버그있나 봐야겠네요!!
  감사합니다.

와일드 @ 2008/12/14 09:50

카테고리 펼침은 어떻게 설정해야하나요?
(이거 완전 초짜라서.. ^^)

iF @ 2008/12/14 19:28

다른 영역 건들이지 않고 딱 본문 글씨체와 글씨색만 바꿔보고 싶습니다. 위에 방법데로 하면 다른 곳도 다 수정되는 거 같아요. 수정해야 하는 부분이 어딘지 좀 알려주세요~

류지♡레이 @ 2008/12/15 20:04

컨테이너 넓이는 그대로 둔채, 컨텐츠랑 사이드바 크기만 서로 조절하는것도 불가능할까요?

예를들어, 본문 넓이는 40px정도 늘이는 대신 사이드바 넓이는 40px정도 줄이는 방식으로요..^_^

QHermes @ 2008/12/22 17:31

안녕하세요 ^ ^ 멋진 스킨 잘 쓰고 있습니다.
다름이 아니라 style.css이 위의 형식과는 다른데, 어쨌든 '맑은 고딕'으로 추가 및 수정하였음에도 글꼴이 적용되지 않아 글 남겨요-.
테스트해보시고 답글 부탁드립니다 (