whiteboard 스킨변경후 해야할것과 한것
- 티스토리스킨수정/스킨수정팁
- 2009. 3. 24. 17:28
이글은 스킨변경 이라는 제목에서 whiteboard 스킨변경후 해야할것과 한것으로 변경후 재포스팅한겁니다.
변경하면서 이것 저것 고쳐야 할 부분이 많아서 정리를 해서 올립니다.
많은 부분이 코멘트 창에 있는 내용입니다.
스킨 변경했습니다.
제가 원하던건 이처럼 흰색의 바탕입니다.
본문사이즈가 넓은 편이면 좋고 1024와 1280 사이즈 둘다 가능한 거였죠^^
화이트보느는 620사이즈 이지만 간단하게 660 까지 본문을 넓힐수가 있습니다.
1.스킨에 대한 상세한 내용을 파악하자.
스킨이 누구에게 다 100% 맞는것은 아니죠. 본인의 입맛대로 수정 편집을 하게 되죠.
그러면 방법을 알아야 하는데 모든 사람이 스킨을 만든사람처럼 스킨에 대해서 잘 아는것이 아니죠.
우선 사이트에 댓글을 읽어보세요.
본문을 넓히는법,제목을 사이즈를 늘리고 줄이는법,글꼴에 대한 얘기,.....
댓글에 보면 답이 나와있습니다.
답변을 넘 잘해주셔가지고 ......보고 따라하시기만 하면 됩니다.
댓글이 너무 많아서 다 보는것도 피곤하더군요.
2.HTML/CSS 에서의 수정 편집
스킨 변경후 해야할것 블로그나라 를 참고한겁니다.
왜 해야하는지는 블로그나라 를 참고하세요.
자 이제 갑니다. whiteboard를 사용하시는 분이라면 구문하나하나 저하고 똑 같을겁니다.
그러니 참고하세요.
whiteboard 스킨은 여기를 참고하세요.
댓글 보시면 아마 어느분이나 다 원하는 스타일로도 만드실수 있을거라 생각됩니다.
아참 그전 스킨에서는 파이어폭스에서는 잘 안나왔습니다.
근데 whiteboard는 잘 나오네요.
1024*768 과 1280*1024 도 잘 지원하네요. 이점 또한 기분좋은 일이죠.아무래도 많은 분들이 1024를 쓰고 계시니까요....
이 부분이 가독성 부분에서도 큰 장점이 아닌가 쉽군요.
저는 1280 을 쓰지만 보시는분이 1024를 사이드바가 없이 그냥 사용할수 있다는 점이죠.
현재 본문 너비도 660으로 넓힌 상태입니다.
사이드바도 약간 수정하구요.....
힘들당
여기서 본문너비를 660으로 넓히는 방법은 whiteoard에 나와있습니다.
못 찾는분을 대신해서 제가 그대로 그 부분만 복사해 옵니다. 참고하세요.
복사내용시작.
본문너비를 660으로 키우는 법
layout.css 28줄.
------------------------------------------------------------
#content {
float: left;
width: 660px;
padding: 10px 30px 50px 204px;
background: transparent url(../images/bg_contentTop.gif) no-repeat scroll 0 0;
}
------------------------------------------------------------
main.css 284줄.
------------------------------------------------------------
/* ####### 본문 ####### */
.entry {
margin: 0 0 100px;
width: 660px;
overflow: hidden;
}
------------------------------------------------------------
index.xml 에서
<contentWidth>640</contentWidth>
위와 같이 수정하시고 스킨을 재적용하시면, 이미지 리사이즈는 640px 로 적용 될겁니다.
여기까지 복사 내용입니다.
참고로 사용해보니까 링크는 빵강색(주황색) 정도로 표시되네요.
뭐 바꿀수도 있지만 그냥 사용하자면 본문 쓰시다 강조내용은 파랑색을 쓰면 좋지 않을까 싶네요.
1024 지원하는 법
사이드바를 250px 로 늘리는 법도 사이트에 나와 있습니다.
본문너비 660과 사이드 250 그리고 1024와 1280사이즈를 지원하면서 본문을 왼쪽으로 밀어서 맞쳤습니다.
아래 파일을 업로드하시면 저처럼 됩니다.
코멘트창의 글씨 크기변경 방법과 아래 더보기는 사이드바의 글씨색,글씨체변경방법
상단의 네비게이션 삭제방법
skin.html 에서 <div id="mainNav"> 영역을 삭제해 버리시거나, css 에서,
#mainNav {display:none;} 이라고 추가해 주면 됩니다.
글 제목 크기 수정 방법
본문 글꼴과 글색깔 조정 방법
위의 내용은 hi8ar에 다 나와있는 내용입니다.
워낙 많은 댓글이 있어 나름 보기 편하게 정리를 몇가지 더 한것입니다.
변경하면서 이것 저것 고쳐야 할 부분이 많아서 정리를 해서 올립니다.
많은 부분이 코멘트 창에 있는 내용입니다.
스킨 변경했습니다.
제가 원하던건 이처럼 흰색의 바탕입니다.
본문사이즈가 넓은 편이면 좋고 1024와 1280 사이즈 둘다 가능한 거였죠^^
화이트보느는 620사이즈 이지만 간단하게 660 까지 본문을 넓힐수가 있습니다.
Whiteboard 스킨변경후 해야할것과 한것
1.스킨에 대한 상세한 내용을 파악하자.
스킨이 누구에게 다 100% 맞는것은 아니죠. 본인의 입맛대로 수정 편집을 하게 되죠.
그러면 방법을 알아야 하는데 모든 사람이 스킨을 만든사람처럼 스킨에 대해서 잘 아는것이 아니죠.
우선 사이트에 댓글을 읽어보세요.
본문을 넓히는법,제목을 사이즈를 늘리고 줄이는법,글꼴에 대한 얘기,.....
댓글에 보면 답이 나와있습니다.
답변을 넘 잘해주셔가지고 ......보고 따라하시기만 하면 됩니다.
댓글이 너무 많아서 다 보는것도 피곤하더군요.
2.HTML/CSS 에서의 수정 편집
스킨 변경후 해야할것 블로그나라 를 참고한겁니다.
왜 해야하는지는 블로그나라 를 참고하세요.
자 이제 갑니다. whiteboard를 사용하시는 분이라면 구문하나하나 저하고 똑 같을겁니다.
그러니 참고하세요.
whiteboard 스킨은 여기를 참고하세요.
댓글 보시면 아마 어느분이나 다 원하는 스타일로도 만드실수 있을거라 생각됩니다.
아참 그전 스킨에서는 파이어폭스에서는 잘 안나왔습니다.
근데 whiteboard는 잘 나오네요.
1024*768 과 1280*1024 도 잘 지원하네요. 이점 또한 기분좋은 일이죠.아무래도 많은 분들이 1024를 쓰고 계시니까요....
이 부분이 가독성 부분에서도 큰 장점이 아닌가 쉽군요.
저는 1280 을 쓰지만 보시는분이 1024를 사이드바가 없이 그냥 사용할수 있다는 점이죠.
현재 본문 너비도 660으로 넓힌 상태입니다.
사이드바도 약간 수정하구요.....
힘들당
여기서 본문너비를 660으로 넓히는 방법은 whiteoard에 나와있습니다.
못 찾는분을 대신해서 제가 그대로 그 부분만 복사해 옵니다. 참고하세요.
복사내용시작.
본문너비를 660으로 키우는 법
layout.css 28줄.
------------------------------------------------------------
#content {
float: left;
width: 660px;
padding: 10px 30px 50px 204px;
background: transparent url(../images/bg_contentTop.gif) no-repeat scroll 0 0;
}
------------------------------------------------------------
main.css 284줄.
------------------------------------------------------------
/* ####### 본문 ####### */
.entry {
margin: 0 0 100px;
width: 660px;
overflow: hidden;
}
------------------------------------------------------------
index.xml 에서
<contentWidth>640</contentWidth>
위와 같이 수정하시고 스킨을 재적용하시면, 이미지 리사이즈는 640px 로 적용 될겁니다.
여기까지 복사 내용입니다.
참고로 사용해보니까 링크는 빵강색(주황색) 정도로 표시되네요.
뭐 바꿀수도 있지만 그냥 사용하자면 본문 쓰시다 강조내용은 파랑색을 쓰면 좋지 않을까 싶네요.
1024 지원하는 법
사이드바를 250px 로 늘리는 법도 사이트에 나와 있습니다.
본문너비 660과 사이드 250 그리고 1024와 1280사이즈를 지원하면서 본문을 왼쪽으로 밀어서 맞쳤습니다.
아래 파일을 업로드하시면 저처럼 됩니다.
코멘트창의 글씨 크기변경 방법과 아래 더보기는 사이드바의 글씨색,글씨체변경방법
상단의 네비게이션 삭제방법
skin.html 에서 <div id="mainNav"> 영역을 삭제해 버리시거나, css 에서,
#mainNav {display:none;} 이라고 추가해 주면 됩니다.
글 제목 크기 수정 방법
1. 글제목은 main.css 294째 줄
--------------------------------------------------
.titleBox h2 {
margin-top: 18px;
color: #666;
font: 400 39px "NanumGothic bold","나눔고딕 bold", NanumGothic, 나눔고딕, "Malgun Gothic", "맑은 고딕", Arial, Sans-serif;
letter-spacing: -3px;
}
--------------------------------------------------
에서 font 39px 부분을 원하시는 사이즈로 줄여주시면 됩니다.
--------------------------------------------------
.titleBox h2 {
margin-top: 18px;
color: #666;
font: 400 39px "NanumGothic bold","나눔고딕 bold", NanumGothic, 나눔고딕, "Malgun Gothic", "맑은 고딕", Arial, Sans-serif;
letter-spacing: -3px;
}
--------------------------------------------------
에서 font 39px 부분을 원하시는 사이즈로 줄여주시면 됩니다.
본문 글꼴과 글색깔 조정 방법
위의 내용은 hi8ar에 다 나와있는 내용입니다.
워낙 많은 댓글이 있어 나름 보기 편하게 정리를 몇가지 더 한것입니다.