텍스트큐브닷컴의 스킨 시스템중 몇몇 부분은 제어할 수 없는 부분들이 있습니다. 프로필도 그렇구, 카테고리 위젯도 그렇구요... 그 중 간단히 카테고리 트리 위젯의 스타일을 변경하는 간단한 꼼수를 공유할까 합니다.
카테고리 트리 위젯의 스타일은 관리자모드의 스킨편집화면에는 나와있지 않습니다. 블로그에서 소스보기를 해보시면 아시겠지만, 아래와 같이 텍스트큐브닷컴에서 지정한 CSS를 쓰도록 되어 있습니다.
<link type="text/css" rel="stylesheet" href="http://rs.textcube.com/service/blog/script/tree/skins/treeBase/style.css" />
위 CSS파일의 내용은 다음과 같습니다.
@charset "utf-8";
.treeBase {
}
}
.treeBase img {
vertical-align:middle;
margin-right:3px;
cursor: pointer;
}
vertical-align:middle;
margin-right:3px;
cursor: pointer;
}
.treeBase .allView {
background:url(image/top.gif) 0 0 no-repeat;
padding-left:17px;
border-bottom:1px dashed #ccc;
}
background:url(image/top.gif) 0 0 no-repeat;
padding-left:17px;
border-bottom:1px dashed #ccc;
}
.treeBase li {
padding:5px 0 1px 0;
border-bottom:1px dashed #ccc;
}
padding:5px 0 1px 0;
border-bottom:1px dashed #ccc;
}
.treeBase li ul li {
background:url(image/list_opened_list.gif) 15px 3px no-repeat;
border:0;
padding:1px 0 1px 30px;
}
background:url(image/list_opened_list.gif) 15px 3px no-repeat;
border:0;
padding:1px 0 1px 30px;
}
.treeBase li.opened {
}
}
.treeBase li.closed {
}
}
.treeBase li.closed ul {
display:none;
}
display:none;
}
.treeBase li#sortHelper {
background:url(image/folder_blank.gif) 0 6px no-repeat;
padding-left:17px;
}
background:url(image/folder_blank.gif) 0 6px no-repeat;
padding-left:17px;
}
.treeBase li ul li#sortHelper {
background:url(image/list_opened_list.gif) 15px 3px no-repeat;
padding-left:30px;
}
background:url(image/list_opened_list.gif) 15px 3px no-repeat;
padding-left:30px;
}
이제 위의 스타일을 참조하여 마음에 안드는 부분을 덮어씌우시면 됩니다. 관리자화면의 스킨편집화면으로 가셔서 skin.html 파일의 </body>앞에 스타일을 적용시켜주시면 됩니다. 다음과 같이 말이죠.
다음은 제가 수정한 부분입니다.
그닥 별 차이 없죠? ^^ 개인적으로 밝은 회색 도트라인이 왜그리 신경쓰이던지 색상을 조금 어둡게 바꾸어 봤습니다. 제가 수정한 부분은 저것 뿐이지만, CSS파일에 나와있는 이미지라던지 여백이라던지 기타 다른부분들도 모두 수정이 가능합니다.
저처럼 1PX에도 민감한 분들은 참고하시기바랍니다~. ^^
댓글을 달아 주세요
역시 코드 공부를 해야 하는 건가요 ㅡㅜ.
어려운일 있으면 말씀하세요~ 도와드릴께요~ ^^
그렇군요 이걸 이제야 알다니....
좋은 정보 감사합니다.
그런데, 혹시 프로필 위젯을 수정하려면 어디를 고쳐야 하는지 질문드려도 될까요^^
제 블로그에 ExperTags를 아예 빼버리고 싶은데....^^
가능할 것 같습니다. 집은 컴퓨터 환경이 안좋아서 내일 회사에서 테스트 해보고 알려드리겠습니다. ^^
오~ 감사합니다.
부탁드리겠습니다.^^
헤헤~ 여기욤~ ^^
http://www.lifebalance.pe.kr/8218
드디어 고칠수 있겠네요
감사합니다.^^
코드, 소스 등을 많이 아시니 부럽습니다.
저도 모르는 거 있으면 물어도 되나요.
기초도 없는데,,, 가능할지 모르겠네요.
자주 놀러 와서 배워야겠어요.
기초보다 조금 아는 정도입니다.
도와드릴 수 있으면 도와드릴께요.
궁금한거 있으시면 언제라도~ ^^