Ghost 블로그에 댓글 기능을 추가하기

node.js 를 사용한 블로그 Ghost 를 설치(2014/05/01 - [프로그래밍/서버관리] - CentOS, node.js - Ghost 설치하기)한 후, disqus 의 댓글 기능을 추가해보았습니다.

http://disqus.com

초기화면에서 "Add Disqus to Your Site" 버튼을 클릭합니다.

아직 가입을 하지 않은 상태라 회원 가입을 하였습니다.

중간에 가입 확인을 위한 이메일이 전송됩니다. 인증을 위해 수신받은 메일의 링크를 클릭합니다.

다시 disqus 홈페이지로 돌아와서 댓글을 사용할 사이트의 정보를 입력합니다. 카테고리의 경우 애매하면 Auto 를 선택하면 됩니다.

등록이 끝나면 플랫폼을 선택하게 되는데... 댓글을 달 홈페이지 혹은 블로그의 종류를 선택합니다. Ghost 의 경우 따로 분류가 없는 관계로 Universal Code 를 클릭합니다.

블로그에 삽입할 스크립트들이 나타납니다. 댓글과 관련한 코드를 복사한 후...

Ghost 테마의 post.hbs 파일내 {{/post}} 와 </article> 앞에 위치하도록 복사하여 넣습니다. 이때 disqus_identifier 라는 변수를 아래와 같이 추가하여 넣습니다. 이렇게해야 각 포스트별로 댓글을 구분하여 리스트가 생성됩니다.^^

var disqus_identifier = '{{id}}';

소스를 적용한 후... node.js 를 재실행하면 댓글 기능이 추가됩니다. 페이스북보다 훨씬 쉬운 거 같습니다. ^^

그리고 블로그의 초기 화면 등... 포스팅 목록의 제목에 댓글의 개수를 출력하기 위해서는 마찬가지로 disqus 에서 생성된 코드를 테마의 default.hbs 에 추가하면 됩니다. 위치는 </body> 태그 바로 위면 되겠습니다.

마지막으로 목록이 출력되는 index.hbs 에 아래의 링크를 추가합니다.

<a href="{{url}}#disqus_thread"></a>

테마에 따라 차이가 있지만 아래와 같이 댓글의 갯수가 출력됩니다.(기본적으로는 1 Comments 와 같은 링크가 생성됩니다. disqus 설정 페이지에서 출력되는 형태를 변경할 수 있습니다.)