예전 제로보드시절부터 항상 다운만 받아서 쓰다가 혹시, 이런팁이라도 원하는 초보분이 계실지도 모른다는 생각에 한번 올려봅니다.

저또한 제로보드XE를 이번에 처음 접하면서, 참...세상 많이 좋아졌구나..(ㅋㅋ) 하는 생각이 들 정도더군요...

좋은 스킨들 만들어주신분들께 먼저 감사드립니다.. ( _ _ )

많은 스킨들중 유독 카운터와 관련해서 제가 원하는 스킨이 없길래...한번 만들어 봤습니다.

이 팁은... "카운터를 원하는 배경으로 만들고 싶은데...CSS이니, DIV니...당췌 울렁증이 있어서.....하지만! html테이블정도는 감당할 수 있어!!" 하는 초보분들에게 해당되는 글이 될듯합니다... 저또한 초보라..   .-_-a;; 긁적..

팁게시판에 올려야지 않을까 하다가... 혹시라도 밑의 배경그림이라도 쓰실분이 있을까...싶어서 여기다가 글을 씁니다. 안맞으면, 삭제 할께요...ㅜ_ㅜ;;

카운터스킨을 만들다가 레이어만으로 작업하다보니, 이상하게 딱 원하는 위치에 카운트가 출력되지 않더군요.... 그래서 레이어안에 테이블을 넣고 배경그림을 깔고, 다시 테이블을 만들어서 원하는 위치에 카운트를 출력시켜봤습니다.  (내공이 미천해서 이렇게 작업하면 어떤 문제가 생길지는 아직 모릅니다만, 다행히 잘 돌아가더군요...;;;;;)




위의 이미지가 그렇게 만들어본 카운터이미지입니다.. 저 초록색 배경그림만 원하는 그림으로 바꾸시고 테이블 사이즈만 재조정 하면 각자 원하는 이미지로 카운터를 만들수 있겠죠...

사이즈는 199 x 113입니다.  각자 좌측메뉴부분의 사이즈가 다를테니,  그림사이즈나 테이블사이즈 조정은 알아서들 하셔야합니다.
저같은 경우엔 위젯으로 올릴 필요성을 못느껴서 기본폴더의 <counter_status.html> 문서를 편집하고, CSS문서는 카운트색상만 흰색으로 바꿔서 두문서를 기본폴더에 덮어씌우고, 배경그림만 따로 image폴더에 올려서 쓰고 있습니다.

먼저 counter_status.html문서에 테이블을 집어넣어서 보면.....

<!--@if($colorset == "normal")-->
    <!--%import("normal/style.css")-->
<!--@end-->

<div class="counter_widget">

     <ul>
<table cellpadding="0" cellspacing="0" width="199" height="113" background="저장경로/counterbg_green.jpg">
    <tr>
        <td>
            <table cellpadding="0" cellspacing="0" width="199" height="113">
                <tr>
                    <td width="199" height="43" colspan="3">
                    </td>
                </tr>
                <tr>
                    <td width="88" height="14">
                                   </td>
                    <td width="52" height="14" align="center">
<!--@if($yesterday_counter)-->
      <li>{$yesterday_counter->unique_visitor}</li>
      <!--@end-->
                    </td>
                    <td width="59" height="14">
                        <p></p>
                    </td>
                </tr>
                <tr>
                    <td width="88" height="14">
                        <p></p>
                    </td>
                    <td width="52" height="14" align="center">
<!--@if($today_counter)-->
      <li>{$today_counter->unique_visitor}</li>
      <!--@end-->
                    </td>
                    <td width="59" height="14">
                        <p></p>
                    </td>
                </tr>
                <tr>
                    <td width="88" height="14">
                        <p></p>
                    </td>
                    <td width="52" height="14" align="center">
<!--@if($total_counter)-->
      <li>{$total_counter->unique_visitor}</li>
      <!--@end-->
                    </td>
                    <td width="59" height="14">
                        <p></p>
                    </td>
                </tr>
                <tr>
                    <td width="199" colspan="3" height="26">
                    </td>
                </tr>
            </table>
        </td>
    </tr>
</table>
</ul>

</div>

html테이블 짜본적 있으신분들은 딱보면 아시겠지만, 한 테이블에 배경깔고, 또 한테이블은 칸을 나눠서 카운트가 될 셀을 확보한 후 배경그림이 깔린 테이블에 집어넣은 후,  높이, 넓이를 맞춘겁니다.

혹시나 봐도 잘 모르겠다 싶으신 분들은 맨위 <table> 부터 끝부분 </table>까지중의 셀들중에서  카운터과 관련된 코드(3군데죠..?)만 지우시고 나모나 드위같은 웹에디터에 복사해서 살펴보시면 쉽게 이해가실겁니다.....

그리고 style.css문서에서는...

.counter_widget {
    border:0px
    padding:0px;
    margin-bottom:5px;
    color:#ffffff;
    font-family:tahoma;
    font-size:8pt;
}

.counter_widget ul { margin:0; padding:0; list-style:none; }

위의 코드중... 폰트색상에 관련된부분.. color:#ffffff;   <----요부분만 바꿨습니다. (마진도 줄였던가.?..;;;)

요렇게 해서 counter_status.html문서는 이미지업로드경로 적어주고 ../widgets/counter_status/skins/default 폴더에 덮어씌우고,  
style.css문서는 ../widgets/counter_status/skins/default/normal 폴더에 덮어씌우면 되겠죠...

끝으로, 사용하실분은 없어보이지만.. ㅜ_ㅜ 저 카운터에 쓰인 배경그림 첨부해봅니다..

팁같지도 않은 초보의 글 읽어주셔서 감사합니다...

모든 초보분이 원하는 그림으로 카운터를 만드시길 바랍니다.