원문의 위치는 다음과 같습니다.

http://www.digist.co.kr/bbs/99493

정식버전에 적용되는 팁은

http://www.digist.co.kr/bbs/113012

위의 링크를 참조해주시기 바랍니다.

댓글로 질문을 하시면 보지 못하게 되는 경우가 많아서 귀찮으시더라도 질문은 제 홈페이지 자유게시판을 이용해주시면 감사하겠습니다. 오래전에 민천기(minnim)님께 이 팁을 올려드린다고 말만 해놓고 너무 바빠서 올리지 못했습니다. 죄송합니다. (담달 초에 결혼에다가... 몇일전엔 동미참 훈련... 쿨럭...)

- 제 블로그의 글을 Copy&Paste한 관계로 경어체를 사용했음을 양해바랍니다.
- 이 글은 XE와 함께 공식 배포되는 xe_blog 스킨을 기준으로 설명하였습니다.

※ 이 글은 무작정 따라하기가 아니라 최대한 설명을 하고자 했기 때문에 내용이 많습니다. 귀찮으시면 볼드에 밑줄친 문장들만 읽으시기 바랍니다.
※ 이 코드들은 제로보드 XE 0.2.3버전에서 테스트되었으며, 차후 버전업을 통하여 작동되지 않을 수 있습니다.
※ 퍼가실 때엔 출처를 명시하시기 바랍니다. (http://www.digist.co.kr)
제로보드 XE는 보드와 별개의 모듈로 블로그를 지원하고 있는데 블로그가 통합되어 지원되는 것은 즐거운 일이지만 아직 쓸만한 블로그 스킨이 없다는 점은 상당히 아쉬운 부분이라 하겠다.

개인적으로 제로님이 블로그를 하고 있지 않으시기 때문-얼마전까지는 운영하셨지만-이 아닐까 생각드는데 초창기의 버전에선 블로그쪽이 꽤나 자질구레한 버그도 많았고 기존에 익숙하던 블로그들과는 다른 작동방식이 많이 눈에 뜨였으나, 현재의 0.2.3 버전 정도라면 웬만한 다른 툴만큼은 쓸 수 있기 때문에 개인적으로 흡족하게 사용중이다.

다만... 현재로선 스스로 많은 부분을 직접 해결해야 하는 문제가 있으니 PHP를 전혀 모른다면 사용을 잠시 보류하는 것도 좋은 방법이겠다.

각설하고 '댓글을 감추는 기능'에 대해 제로보드 XE에 포함된 'xe_blog' 스킨을 기준으로 설명하면 다음과 같다. 사실 댓글을 감추는 기능 자체는 대단히 간단하다.





1. 트랙백 끄고 켜기


우 선 트랙백 영역부터 끄고 켜도록 만들어보자. 사실 원리는 트랙백을 토글하거나 댓글을 토글하는 것이 동일하지만댓글을 토글하는데 있어선 자바스크립트 에러를 회피하기 위해 약간의 꽁수를 사용해야 하기 때문에 일단 트랙백부터 끄고 켜도록 만들어보자.

modules/blog/skins/xe_blog/js/blog.js 파일 하단에 다음의 내용을 추가한다.

function toggle_object(post_id){
    var obj = xGetElementById(post_id);
    if(!obj) return;

    if(obj.style.display=="none"){
        obj.style.display='block';
    } else {
        obj.style.display="none";
    }
}

이 함수는 간단하게 작성한 토클 함수이다. post_id에 명시된 id 값을 가지는 엘리먼트를 끄고 켜는 역할을 한다. 이 함수는 트랙백 영역 뿐 아니라 댓글까지 끄고 켜는데 사용될 것이다.

이제 modules/blog/skins/xe_blog/view_document.html 파일을 열어 <!-- 엮인글 파일 include -->라고 써있는 아랫 부분을 다음과 같이 고치도록 한다.

<!-- 엮인글 파일 include -->
<div id="blog_trackback_{$oDocument->document_srl}" style="display:none">
<a name="trackback_{$oDocument->document_srl}"></a>
<!--@if($oDocument->allowTrackback())-->
    <!--#include("./trackback.html")-->
<!--@end-->
</div>

실제로 추가된 코드는 바탕이 노랗게 표시된 부분이며 토글할 영역을 div 태그로 묶어준 간단한 코드이다. 이대로 업로드를 하면 트랙백을 보고 싶을때 볼수가 없으므로 약 88번째 줄을 다음과 같은 코드로 수정해준다.

       <!--@if($oDocument->allowTrackback())-->
            <li class="trackback"><a href= onclick="#""toggle_object('blog_trackback_{$oDocument->document_srl}'); return false;">{$lang->trackback} <strong>{$oDocument->getTrackbackCount()}</strong></a></li>
        <!--@end-->

이제 두 개의 파일을 업로드해서 확인해보자. 트랙백 영역은 처음에 감추어졌다가 "트랙백"이라는 글씨를 클릭하면 나타나고 다시 누르면 사라지게 된다.





2. 댓글 끄고 켜기


댓글 영역을 끄고 켜는 것도 사실 트랙백과 거의 동일하다. 다만 제로보드 XE는 위지윅 에디터를 기본으로 사용하기 때문에 일부 브라우저에서 심각한 에러가 발생된다. 이 문제에 대해 이해하고 싶다면 이전에 내가 작성해 놓았던 포스트를 참고하기 바란다.

파이어폭스 designMode 버그

참고로 이 문제는 제로보드 XE의 문제가 아니라 모든 크로스 브라우징 위지윅 에디터들이 가지는 문제점이다. (익스플로러에서만 구동되도록 만든 위지윅 에디터는 이런 문제없다. 그 에디터들은 애초에 파폭에서 작동되지 않으니...)

일단 트랙백 영역이 토글되도록 만든것처럼 view_document.html을 고친다.

약 80번째 라인을 다음과 같이 수정하고...

       <!--@if($grant->write_comment && $oDocument->allowComment()) -->
            <li class="reply"><a href= onclick="#""toggle_object('blog_comment_{$oDocument->document_srl}'); return false;">{$lang->comment} <strong>{$oDocument->getCommentCount()}</strong></a></li>
        <!--@end-->

약 100번째 라인을 아래와 같이 바꿔준다.

<!-- 댓글 파일 include -->
<div id="blog_comment_{$oDocument->document_srl}" class="blog_auto_fold">
<a name="comment_top_{$oDocument->document_srl}"></a>
<!--@if($grant->write_comment && $oDocument->allowComment())-->
    {@ $document_srl = $oDocument->document_srl; }
    <!--#include("./comment.html")-->
<!--@end-->
</div>

위의 코드를 유심히 보면 알겠지만 트랙백에서와는 다르게 지정된 부분이 있다. 바로 class="blog_auto_fold"라고 되어 있는 부분이다. 이것은 파이어폭스 designMode 버그를 회피하기 위해 사용된 꽁수를 위한 것으로 다음에 수정할 blog.js에서 이용될 것이다.

왜 이런 코드를 작성하게 되는지 다시 설명하기는 복잡한 관계로 위의 링크를 확인하기 바라고, 아무튼 designMode 버그를 회피하기 위해 modules/blog/skins/xe_blog/blog.js파일의 하단에 다음과 같은 내용을 기입한다.

if(typeof(editorStart) != 'undefined'){
    _oldEditorStart = editorStart;
    editorStart = function(es,pk,ck,rz,eh) {
    _oldEditorStart(es,pk,ck,rz,eh);
    ele = xGetElementById("xeEditorOption_" + es).parentNode;
    while(ele.parentNode && ele.className != 'blog_auto_fold') ele = ele.parentNode;
    if(ele.className == 'blog_auto_fold') ele.style.display = 'none';
    }
}

이 코드는 다소 위험해 보이지만 (기존 코드를 마음대로 변형시키는 코드이다) 최소한 스킨 주제에 제로보드 XE 기본코드를 뜯어고치는 짓은 하지 않으므로 가장 훌륭한 해결책이 될 것이라고 생각한다.

이제 테스트를 해보면 원하는 작동을 할 것이다.





3. 좀 더 다듬기


위의 코드로도 처음 원하던 대로 작동은 된다. 다만 한가지 아쉬움이 있는데... 댓글을 작성하고 났을때에도 자동으로 댓글이 감춰진채로 글이 보이는데다가 퍼머링크(permalink)로 블로그의 글을 읽을때에도 여전히 댓글이 감추어지기 때문에 사용하기 불편해보인다.

이 문제를 해결해보자. 참고로 사용된 방법은 다소 깔끔하지 못하여 마음에 들지는 않지만 여러가지로 테스트 해본 결과 현재로선 이렇게밖에 방법이 없는듯하다.

먼저 view_document.html의 가장 상단에 다음과 같은 코드를 삽입한다.

<!-- 글 내용 보여주기 -->
<!--@if(($document_srl || $rnd)&&count($document_list)==1)-->
{@ $block_class = ""; }
{@ $display_style = "block"; }
<!--@else-->
{@ $block_class = "blog_auto_fold"; }
{@ $display_style = "none"; }
<!--@end-->

여기서 포스트의 출력되는 갯수로 처리하면 간단할텐데 왜 이런 짓을 하냐고 의문을 가질 수 있다. 만일 포스트 갯수로 처리하면 이 블로그처럼 한 페이지에 한개의 글만 보이는 경우 댓글 감춰지는 기능 자체가 안되기 때문에 위와 같이 처리해야 한다.

다음 view_document.html의 가장 하단부분을 다음 코드로 교체한다. 참고로 수정된 부분은 바탕이 노란색으로 표시되어 있다.

<!-- 엮인글 파일 include -->
<div id="blog_trackback_{$oDocument->document_srl}" style="display:{$display_style}">
<a name="trackback_{$oDocument->document_srl}"></a>
<!--@if($oDocument->allowTrackback())-->
    <!--#include("./trackback.html")-->
<!--@end-->
</div>

<!-- 댓글 파일 include -->
<div id="blog_comment_{$oDocument->document_srl}" class="{$block_class}">
<a name="comment_top_{$oDocument->document_srl}"></a>
<!--@if($grant->write_comment && $oDocument->allowComment())-->
    {@ $document_srl = $oDocument->document_srl; }
    <!--#include("./comment.html")-->
<!--@end-->
</div>

이제 파일을 업로드하여 정상적으로 작동되는지 확인해보도록 하자. 만일 위와 같이 일일히 고치기 귀찮거나 무슨 소리인지 모른다면 첨부된 파일을 다운로드 받아 포함된 파일 2개를 xe_blog 스킨위에 덮어 씌운다.
이 게시물을..