기본적으로 Hexo에는 댓글 기능이 없다. 개발자가 만들어서 쓰던지, 설치형 댓글 서비스를 이용하던지 해야한다. 이미 유명한 Disqus라는 댓글 서비스가 있기 때문에 이를 이용하면 효율적인 댓글 시스템을 구축할 수 있다.

사용하는 블로그 테마에 따라 comment를 지원하는 경우가 있을 수 있으니 해당 테마의 설명에서 확인해보자.

내가 사용하는 Chic 테마는 disqus comment 기능이 내장되어 있지 않기 때문에 직접 코드를 넣어주어야 했다.

Disqus 가입, 설정하기

  • Disqus에 회원가입 후 프로필, 계정을 설정하고 GET STARTED 버튼을 클릭한다.
  • I want to install Disqus on my site를 클릭한다.
  • 사이트명, 카테고리를 선택하고 Create Site를 클릭한다.
  • plan을 선택해야 하는데 무료 사용으로도 댓글 기능을 사용할 수 있기에 Basic을 선택한다.

이제 Platform을 선택하는데, Jekyll, WordPress 등의 블로그 플랫폼은 지원하지만 Hexo는 목록에 없다. 밑에 **I don’t see my platform~**을 선택한다.

테마에 Disqus 위젯 넣기

테마에서 post와 관련된 ejs 파일을 찾아 밑의 코드 또는 Disqus 사이트에서 넣으라고 준 코드 를 원하는 부분에 끼워넣으면 된다.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
<div id="disqus_thread"></div>
    <script>
    /**
    *  RECOMMENDED CONFIGURATION VARIABLES: EDIT AND UNCOMMENT THE SECTION BELOW TO INSERT DYNAMIC VALUES FROM YOUR PLATFORM OR CMS.
    *  LEARN WHY DEFINING THESE VARIABLES IS IMPORTANT: https://disqus.com/admin/universalcode/#configuration-variables*/
    /*
    var disqus_config = function () {
    this.page.url = PAGE_URL;  // Replace PAGE_URL with your page's canonical URL variable
    this.page.identifier = PAGE_IDENTIFIER; // Replace PAGE_IDENTIFIER with your page's unique identifier variable
    };
    */
    (function() { // DON'T EDIT BELOW THIS LINE
    var d = document, s = d.createElement('script');
    s.src = 'https://사용자이름.disqus.com/embed.js';
    s.setAttribute('data-timestamp', +new Date());
    (d.head || d.body).appendChild(s);
    })();
    </script>
    <noscript>Please enable JavaScript to view the <a href="https://disqus.com/?ref_noscript">comments powered by Disqus.</a></noscript>

Hexo 서버 재실행하기

1
hexo d -g

모든 설정이 끝났으니 Hexo 서버를 deploy한다.

이제 블로그를 가보면, 게시물마다 Disqus 댓글 시스템이 구축된 것을 볼 수 있다!
무슨 블로그 플랫폼에 댓글이 셀프냐고 할 수도 있겠지만, 익숙한 것에 대한 고마움을 느낀다.