코멘트 창의 스크롤 바를 바꿔보자.

어제는 코멘트 창에 배경 그림을 깔았습니다.

이번에는 코멘트 창에 생기는 스크롤바의 색을 바꿔볼까 합니다.

 

기존의 스크롤바는 자신의 윈도우 스타일을 따라 가는 투박한 모양이었습니다.

그렇지만 제 블로그는 코멘트 창을 열어보면 다음과 같은 글쓰기 창이 나타납니다.

보시다시피 스크롤 바가 백색과 갈색으로 바뀌어 있죠.(사실 노트라서 진짜 투명하게 하고 싶지만 그건 좀 더 연구해 봐야 할 듯...)

이번엔 이 부분에 대한 설명을 할까 합니다.

어제와 같이 자신의 스킨의 스타일 시트를 열어주세요.

혹시 모를 사고에 대비해 텍스트 에디터(저는 크림슨 에디터라는 것을 사용합니다.)를 열어 스타일 시트를 카피해 옵니다.

텍스트 에디터를 사용해서 좋은 점은 줄 번호가 매겨져 있어 찾기가 쉽다는거죠.

자. 이제 스타일 시트에서 다음과 같은 부분을 찾아줍니다.

붉은색 화살표가 있는 부분(65번줄)을 보시면 .tt-input-div textarea 라고 있습니다.

이 부분이 코멘트 쓰는 창을 설정하는 건데요.

이 부분의 코드는 아래와 같습니다.

.tt-input-div textarea  { width:600px; height:220px; background:url(images/wing.png); overflow:visible; border:1px solid #ddd;}
물론 여기서 배경 그림(background:url(images/wing.png); 로 설정)은 자신이 쓴 것으로 바뀌어 있을거예요. 지난번 것을 하셨다면요. 아니면 저 부분이 없을겁니다.

 

그 부분을 이번엔 이렇게 바꿨습니다.

추가된 부분을 보시면 아래와 같은 내용입니다.

         scrollbar-face-color:#ffffff;
         scrollbar-highlight-color: #E28F00;
         scrollbar-shadow-color: #E28F00;
         scrollbar-3dlight-color:#ffffff;
         scrollbar-track-color:#ffffff;
         scrollbar-arrow-color: #E28F00;
         scrollbar-darkshadow-color:#ffffff;

 

홈페이지를 제작하시던 분들은 아시겠지만 일반적인 스크롤바 코드죠?

여기서 #ffffff 와 #e28f00이 각각 흰색과 갈색입니다.

이 부분의 색을 원하는 것으로 바꿔주시면 됩니다.

 

그럼 내 입맛에 맞는 코멘트 창이 나오겠지요.

단.... 파폭에서는 적용이 안되네요.... 아이고 머리야아아..

 

내 입맛에 맞는 예쁜 스킨을 만들기 위해서 저는 또 코드 파러 갑니다...ㅠ.ㅠ

 

텍큐에 치환자 매뉴얼 공개 부탁했는데... 언제나 가능할라나~~~ㅠ.ㅠ