Friday, June 27, 2008

블로거 인라인 코멘트 폼 Blogger Inline Comment Form

블로거닷컴을 사용하는 블로거들의 가장 큰 불만은 워드프레스와 같은, 새 창을 열지 않고 댓글을 쓸 수 있는 인라인 코멘트 폼 Embedded (Inline) Comment Form을 제공하지 않는다는 것이다.


이런 구글 블로거들의 오랜 숙원(?)사업인 인라인 코멘트 폼을 Blogger in Draft에서 새로운 기능으로 인라인 코멘트 폼을 공개했다. 아직은 정식으로 퍼블리싱 된 것은 아니지만, 바로 블로그에 적용하여 사용할 수 있다.


먼저, 인라인 코멘트 폼을 사용하기 위해서는 http://draft.blogger.com/으로 로그인하여, 대시보드 -> 설정 -> 의견 -> 댓글 양식 게재 - 게시물 아래에 삽입됨으로 선택하고 설정사항을 저장하면 된다. 인라인 코멘트 폼이 바로 적용되어 사용할 수 있지만, 사용자가 블로그 템플릿을 수정하여 사용하는 블로그는 인라인 코멘트 폼이 나타나지 않는 경우가 있다. 내 경우도 인라인 코멘트 폼이 나타나지 않았다.


마침, 오늘 올라온 How to add a comment form beneath your blog posts 글을 읽으면서 템플릿을 수정하여 인라인 코멘트 폼을 적용할 수 있었다. How to add a comment form beneath your blog posts에 게시된 수정 코드가 내 템플릿에는 에러를 표시하고, 바로 적용을 할 수 없어서 일부를 수정한 다음에야 예쁜 인라인 코멘트 폼을 볼 수 있었다.


템플릿을 수정하기 전에 백업하고, 대시보드 -> 레이아웃 -> HTML 편집 -> 템플릿 수정 -> 도구 템플릿 확장을 클릭한다.


템플릿에서 다음 코드를 찾는다.

<p class='comment-footer'>
<a expr:href='data:post.addCommentUrl' expr:onclick='data:post.addCommentOnclick'>
<data:postCommentMsg/></a>
</p>
</b:if>


아래 오렌지색으로 표시한 부분과 같이 코드를 추가한다.

<p class='comment-footer'>
<b:if cond='data:post.embedCommentForm'>
<b:include data='post' name='comment-form'/>
<b:else/>
<a expr:href='data:post.addCommentUrl' expr:onclick='data:post.addCommentOnclick'>
<data:postCommentMsg/></a>
</b:if>
</p>
</b:if>

템플릿을 저장한 다음 블로그 개별 페이지를 보면 인라인 코멘트 폼이 적용되었음을 알 수 있다.


Update: 댓글을 입력하고 나면 인라인 코멘트 폼 오른쪽에 스크롤바가 생기는데, 아래의 코드에 있는 height='275'를 height='300'으로 수정하였더니 보이지 않게 되었다.

<iframe allowtransparency='true' expr:src='data:post.commentFormIframeSrc' frameborder='0' height='275' id='comment-editor' scrolling='auto' width='100%'/>
(2008.06.28)


Update-2: 오늘 "블로거가 좋은 이유 The Reason Why I Love Blogger" 를 쓰다가 알게 된 사실이다. 인라인 코멘트 폼은 댓글 미리보기 버튼 Preview Button과 댓글 이메일로 구독하기 E-mail Comment Subscription 추가된 댓글 이메일로 알려주기 Comment-Tracking System기능을 지원하지 않는다. 추후 지원할 것인지에 대한 사항이 언급이 없다. (2008.06.29)

Update-3: 댓글 미리보기와 댓글 이메일 구독하기가 다 지원된다. 나이스~ (2008.10.24)

15 comments:

  1. 와우. 기어코 여기까지 발전했군요. 저도 당장 시운전을 해 보겠습니다. 감싸합니다.

    ReplyDelete
  2. [나무] 숙원사업이 이루어진 느낌입니다. ^^

    잠깐 나무님 페이지 가 보았는데, height값을 더 크게 하면 스크롤바가 사라지지 않을까 생각합니다.

    ReplyDelete
  3. 1. 저는 스크롤바가 FF에서는 안 보이고 IE에서만 보입니다. 저만 그런가요?

    2. height값을 크게 하면 코멘트 박스가 위치한 부분의 높이가 커져 아랫도리 공간이 늘어나는데요. 지금 코멘트 박스의 속성값은 수정이 안 되게 돼 있네요.

    ReplyDelete
  4. [나무]
    1. 제가 파이어폭스에서 보았는데, 폼 박스옆에 스크롤바가 보이더라구요.

    2. 아랫도리가 늘어나는 문제를 생각했지만, 멀쩡한 상태에서 스크롤 바가 보이니 조금 거시기 해서 말입니다. 속성값은 그냥은 보이지 않지만, 템플릿에서 도구 템플릿 확장을 하고 찾아보셔야 합니다.

    ReplyDelete
  5. [나무] IE에서 보니 박스안에 흐미하게 보입니다. 제가 말씀드린 것은 파이어폭스에서 박스 밖으로 보이는 스크롤바입니다.

    ReplyDelete
  6. 아 드디어 나왔군요 ^^
    저도 적용해 보았습니다.
    좋은 정보 감사합니다.

    ReplyDelete
  7. [Kim, Kiseok] 가서 보았습니다. 이쁘던데요. :)

    ReplyDelete
  8. 지저깨비님 블로그의 코멘트 박스 높이를 수정(275 -> 300)하기 전에도 박스 바깥으로 스크롤바는 보이지 않았는데요.

    그리고 제 피씨나 옆의 다른 피씨 모니터로 봐도 박스 바깥에 스크롤바는 생기지 않던데 저만 그렇게 보이는 건가봐요. ㅜㅜ

    코멘트 입력박스 폭이나 높이를 수정하는 속성은 아직 없고 고정돼서 제공이 되는 것 같네요.

    ReplyDelete
  9. [나무] 브라우저 특성을 타야 하는, 타게 되는 형편상 내 눈에 보이는대로, 보이지 않으면 문제가 없는 것처럼 지내야 하지 않을까요? ㅡ.ㅡa;;;

    ReplyDelete
  10. 덕분에 좋은 정보 얻어갑니다 ^^

    ReplyDelete
  11. [dal] 도움이 되시길 바랍니다. ^^

    ReplyDelete
  12. 이거대로 해서 만들었어요. 감사합니다. ㅎㅎ

    ReplyDelete
  13. [WonRyong] 도움이 되셨다니 기쁘네요. ^^

    ReplyDelete
  14. 그러고 보면 블로거닷컴에 마이센스 달려고 했지만 템플릿오류로 ㅈㅈ치고말았네요.
    그에 관련글이 보이지 않으니까 왠지 불편하기도 하고...

    ReplyDelete
  15. [달이] 마이센스가 무었인지요? 그리고 글의 태그와 연관된 관련글을 보여주는 위젯이 있답니다. 관련글 위젯을 보시면 쉽게 관련글 위젯을 설치할 수 있답니다.

    ReplyDelete