CMS솔루션마켓, 이온디 - 워드프레스, 라이믹스, 카페24, 그누보드, 엑셀

홈페이지 제작팁

위젯 스킨 제작시 주의점

이온디
2007년 09월 03일
각종 모듈 및 위젯 스킨 제작자님들,
스킨 제작하실 적에 주의해야할 점이 있는데요,

바로, id명과 class명이거든요.

만들다보니깐 이런 문제가 있는 걸 알게됐는데
한 페이지에 다양한 스킨이 들어갈 수 있잖아요.

메인 페이지를 예로 들어 말씀드리면,
공지사항, 최신댓글, 최근 이미지 등등.

그런데 해보니깐 css class명이 중첩되는 경우가 있더라고요.

블로그 최근 글 위젯과 블로그 최근 댓글 위젯의 동일한 클래스명이 있을 경우
서로 다른 스타일일 경우에

그 스킨이 서로 다른 스타일을 보여주지 못하고 나머지 하나의 class에 종속되어버리는 경우가 있더라고요.

스타일시트에서 최근글에는 제목에 밑줄이 없는데
최근댓글에 제목 밑줄을 넣을 경우,

이렇게 되면 같인 header라는 class명을 사용하는데 최근글에도 마찬가지 밑줄이 들어가버리는 현상이 있더라고요.


css가 한 div 내에서만 id명이라든가 class명이 사용되는 것이 아니라
전 페이지 내에서 사용되는 것이니 만큼

이런 문제점이 생길 수가 있습니다.

그러니 제작하시는 분들이 알아서 자신이 제작하는 스킨의 클래스명이나 아이디명에 다른 스킨과 구별되는 _id 를 붙여주셨으면 합니다.

예를 들어 newest_comment 의 경우

/* Newest Comments Title */ 이라고 주석으로 기본적으로 클래스의 역할이 뭔지 위에 설명을 달아놓으시고 만약에
그 스타일을 적든지 아니면 본인의 아이디나 스킨 이름을 적는 것이죠.
만약에 cyworld 스타일이라고 한다면

이렇게요.

/* Newest Comment Title Cyworld Style */ 대강 이런 식의 설명을 달고 클래스명은 간편하게 줄여서
.nct_cy {}

이런 식으로 적는다면 '최근코멘트의 싸이월드 스타일의 제목' 쯤이라는 뜻이라는 걸 알 수가 있잖아요.

이런 식으로 여러분들만의 스킨제작 class명을 만들어서 올려주시면

사용하시는 분들이 중첩되지 않게 여러 종류를 쉽게 사용을 할 수 있을 것 같습니다.

동의하신다면 추천을 눌러주세요. 그래서 많은 분들이 이렇게 스킨을 제작하고 올려주셨으면 좋겠습니다.
 
댓글은 로그인 사용자만 작성 가능합니다. 로그인하기