스킨 제작 프로젝트 - Step3. 스킨 제작
글수 73
zb5beta 에서 zbxe로 저번주에 갈아타게 되었습니다.
마이그레이션 하는데 고생 잠깐하고 사용하고 있습니다.
당분간 개인적으로 스킨수정에 버닝해야 할것같네요
나름 재미를 느끼고 있습니다.
ZeroBoard 를 맘껏 사용해보고자 PHP를 한달전부터 공부하고있는데 책에 나온것과 많이 생소해 당황해 하고 있답니다.
-------------------------------------------------
답글 스킨을 약간 (-.- 수정도 되지 못할만큼) 변경해 보았습니다.
목적 : 답글간 경계를 확실히 하자
이유 : 답글간 경계가 없어(있더라도 약해) 보는데 애로사항이 있다.
근거 : 사용자들이 기존 ZB5Beta때보다 답글간 구분이 어렵다고 토로
www.sootnae.com <- 요기가 제가 사용하는 사이트 주소입니다.
(곰돌이 푸 + 코카콜라 백곰 + 우루사 곰 = 트리플 곰돌이) 별명이 말해주듯 몸매는 동글 동글 합니다만
답잖게 취미가 마라톤입니다.
마라톤클럽 홈페이지를 담당하고 있습니다.
첫 구축때 Zb5beta로 만들어 잘 사용하였기에 제로님에게는 항상 감사하고 있습니다.
사이트 라는것이
저같은 개발자, 젊은 것들이 사용도 하겠지만
나이가 있으신 분들이 보고 사용하기에도 어렵지 않는 디자인이 되어야 한다고 생각합니다.
그 이유로 답글 스킨에 약간 수정을 가해 주었습니다.
--------------------------------------------------------------
파일 :
1. /zbxe/modules/board/skins/xe_board/comment.html
2. /zbxe/modules/board/skins/xe_board/css/common.css
1. comment.html
원본 :
{@ $_comment_list = $oDocument->getComments()}
<!--@foreach($_comment_list as $key => $comment)-->
<div class="replyItem <!--@if($comment->get('depth'))-->reply<!--@end-->">
수정 :
{@ $_comment_list = $oDocument->getComments()}
{@$co_cnt = 0}
<!--@foreach($_comment_list as $key => $comment)-->
{@$co_cnt = $co_cnt+1}
<div class="replyItem_{$co_cnt%2} <!--@if($comment->get('depth'))-->reply<!--@end-->">
2. css/common.css
원본 :
.replyBox { padding:.6em .6em; color:#666666; border:1px solid #e0e1db; margin-top:.5em;}
.replyBox .replyItem {padding:.6em .8em .6em .6em; line-height:1.25em; clear:both; border-bottom:1px dotted #EEEEEE; list-style:none;}
수정 :
.replyBox { padding:.6em .6em; color:#666666; border:1px solid #e0e1db; margin-top:.5em;}
.replyBox .replyItem {padding:.6em .8em .6em .6em; line-height:1.25em; clear:both; border-bottom:1px dotted #EEEEEE; list-style:none;}
.replyBox .replyItem_0 {padding:.6em .8em .6em .6em; line-height:1.25em; clear:both; border-bottom:1px dotted #EEEEEE; list-style:none;}
.replyBox .replyItem_1 {background-color:rgb(245,245,245);padding:.6em .8em .6em .6em; line-height:1.25em; clear:both; border-bottom:1px dotted #EEEEEE; list-style:none;}
위처럼 수정하면 답글간 에 배경색으로 구분됩니다.
현재도 [답글] 과 [답글에 대한 답글] 배경색이 다르지만
그부분도 원할경우 같은 방법으로 적용됩니다.
수정이라고 하기에도 약한 부분이지만 작은 수정입니다.
사용자 보기 편함을 위하여 진행한 부분이기에 참고하실분들은 하시라고 씁니다. (-.- 부끄럽지만서도)
마이그레이션 하는데 고생 잠깐하고 사용하고 있습니다.
당분간 개인적으로 스킨수정에 버닝해야 할것같네요
나름 재미를 느끼고 있습니다.
ZeroBoard 를 맘껏 사용해보고자 PHP를 한달전부터 공부하고있는데 책에 나온것과 많이 생소해 당황해 하고 있답니다.
-------------------------------------------------
답글 스킨을 약간 (-.- 수정도 되지 못할만큼) 변경해 보았습니다.
목적 : 답글간 경계를 확실히 하자
이유 : 답글간 경계가 없어(있더라도 약해) 보는데 애로사항이 있다.
근거 : 사용자들이 기존 ZB5Beta때보다 답글간 구분이 어렵다고 토로
www.sootnae.com <- 요기가 제가 사용하는 사이트 주소입니다.
(곰돌이 푸 + 코카콜라 백곰 + 우루사 곰 = 트리플 곰돌이) 별명이 말해주듯 몸매는 동글 동글 합니다만
답잖게 취미가 마라톤입니다.
마라톤클럽 홈페이지를 담당하고 있습니다.
첫 구축때 Zb5beta로 만들어 잘 사용하였기에 제로님에게는 항상 감사하고 있습니다.
사이트 라는것이
저같은 개발자, 젊은 것들이 사용도 하겠지만
나이가 있으신 분들이 보고 사용하기에도 어렵지 않는 디자인이 되어야 한다고 생각합니다.
그 이유로 답글 스킨에 약간 수정을 가해 주었습니다.
--------------------------------------------------------------
파일 :
1. /zbxe/modules/board/skins/xe_board/comment.html
2. /zbxe/modules/board/skins/xe_board/css/common.css
1. comment.html
원본 :
{@ $_comment_list = $oDocument->getComments()}
<!--@foreach($_comment_list as $key => $comment)-->
<div class="replyItem <!--@if($comment->get('depth'))-->reply<!--@end-->">
수정 :
{@ $_comment_list = $oDocument->getComments()}
{@$co_cnt = 0}
<!--@foreach($_comment_list as $key => $comment)-->
{@$co_cnt = $co_cnt+1}
<div class="replyItem_{$co_cnt%2} <!--@if($comment->get('depth'))-->reply<!--@end-->">
2. css/common.css
원본 :
.replyBox { padding:.6em .6em; color:#666666; border:1px solid #e0e1db; margin-top:.5em;}
.replyBox .replyItem {padding:.6em .8em .6em .6em; line-height:1.25em; clear:both; border-bottom:1px dotted #EEEEEE; list-style:none;}
수정 :
.replyBox { padding:.6em .6em; color:#666666; border:1px solid #e0e1db; margin-top:.5em;}
.replyBox .replyItem {padding:.6em .8em .6em .6em; line-height:1.25em; clear:both; border-bottom:1px dotted #EEEEEE; list-style:none;}
.replyBox .replyItem_0 {padding:.6em .8em .6em .6em; line-height:1.25em; clear:both; border-bottom:1px dotted #EEEEEE; list-style:none;}
.replyBox .replyItem_1 {background-color:rgb(245,245,245);padding:.6em .8em .6em .6em; line-height:1.25em; clear:both; border-bottom:1px dotted #EEEEEE; list-style:none;}
위처럼 수정하면 답글간 에 배경색으로 구분됩니다.
현재도 [답글] 과 [답글에 대한 답글] 배경색이 다르지만
그부분도 원할경우 같은 방법으로 적용됩니다.
수정이라고 하기에도 약한 부분이지만 작은 수정입니다.
사용자 보기 편함을 위하여 진행한 부분이기에 참고하실분들은 하시라고 씁니다. (-.- 부끄럽지만서도)
2007.11.26 17:24:23 (*.141.87.210)
초보자분들을 위해 comment.html 과 css/common.css 파일의 전체경로를 기입해주시면 감사하겠습니다.
제로보드XE의 경우 모듈별, 위젯별 스킨이 모두 존재하기때문에
어느 위치에 있는 파일인지에 대한 명시도 분명해야할듯 싶습니다.
XE를 좀 많이 뜯어보시고 개념정리가 잘되신분들은
쉽게 아 modules/board/skins/ 안에 있는 스킨내용부분을 수정하면 되겠구나 하겠지만
아직 미숙한 상태에서 이 팁을 적용해보시려는 분들은 어디있는 파일인지 전혀 감을 못잡으실듯 합니다.
조금이라도 시행착오를 줄이고 팁의 목적이 보다 많은 분들이 사용할수 있게하기 위함이니까요. ![]()



