댓글 기능 추가하기

댓글 기능 추가하기
Photo by Kelly Sikkema / Unsplash

블로그를 운영한다면 이용자들과 소통이 중요할 것이다. 댓글은 이메일보다 강력한 유대관계를 형성할 수 있다. 부족한 부분을 채울 수 있고, 무엇을 원하는지도 알 수 있다. 독자들과의 소통 공간을 원한다면 댓글은 필수라 할 수 있다.

Disqus 가입 및 사이트 추가

댓글 기능은 disqus를 이용한다면 쉽게 추가할 수 있가. 먼저 https://disqus.com/ 에 방문하여 계정을 생성한다.

상단의 pricing 탭을 눌러서 원하는 요금제를 선택한다. 난 basic 플랜을 선택했다. 혹은 상단 오른쪽에 있는 톱니바퀴 아이콘을 눌려서 Add Disqus to your site를 클릭한다. 그리고 사이트 이름을 입력하고 URL을 입력한다. 카테고리는 적당한 것을 골라준다.

이제 Ghost에 터미널로 접속해서 root폴더로 이동한다. 그리고 yourghostroot/content/themes/yourtheme로 접근하면 post.hbs 파일이 있을 것이다. 아래 코드를 찾아내서

<section class="article-comments gh-canvas">
        <div id="disqus_thread"></div>
        <script>
            var disqus_config = function () {
                this.page.url = "{{url absolute="true"}}";
                this.page.identifier = "ghost-{{comment_id}}"
         };
        (function() {
         var d = document, s = d.createElement('script');
         s.src = 'https://yourshortname.disqus.com/embed.js';
         s.setAttribute('data-timestamp', +new Date());
          (d.head || d.body).appendChild(s);
            })();
        </script>
    </section>

로 교체해준다. https://yourshortname.disqus.com/embed.js 에서 yourshortname은 Disqus admin으로 들어가면 사이트 설정에 나와있다. 값을 찾아내서 교체해주자. 그리고 파일을 저장하고 ghost restart하면 각 포스트마다 댓글쓰기가 나타날 것이다.


참고

Official Ghost + Disqus Integration
Setting up Disqus with Ghost allows you to embed comment threads, upvotes and emoji reactions on your posts & pages. Install comments on your site ?
The complete guide to adding comments in Ghost
Comments can jump-start the conversation on your publication and give your community a place to engage with one another. This tutorial will walk you through the process of adding comments to your Ghost theme.