Disqus - 덧글 / 댓글 기능 추가하기

Disqus - 덧글 / 댓글 기능 추가하기

 

Disqus의 플랫폼을 이용하면 html에 백엔드 없이 덧글 기능을 추가 할 수 있습니다.

조코딩의 영상에 나온 쉽게 덧글/댓글 기능을 추가하는 방법입니다.

 

 

1. Disqus의 사이트에 회원가입후 로그인 합니다.

https://blog.disqus.com/

Disqus Blog

 

2. Get started / i want to install Disqus on my site(아래) 버튼을 누른다.

 

3. 덧글 기능을 추가할 사이트 주소를 입력하고 카테고리를 고른다.

언어는 한국어를 지원하지 않기 때문에 영어를 고르시면 됩니다.

 

 

4.  하단의 유니버셜 코드를 클릭합니다

 

---

 

<-- 유니버셜 코드 입니다.

 

 

 

5. 유니버셜 코드를 누르게 되면 관리자 페이지로 이동하는데 하단의 코드를 복사합니다.

 

 

6. 덧글 기능을 넣을 페이지 문서(HTML) </body> 태그 앞에 코드를 넣어 줍니다. 

<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://https-sda0503-github-io.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>

 

7. 저장하고 반영이 잘되었는지 확인합니다.

저는 깃허브 블로그에 반영하였고 잘 적용된것을 확인 할 수 있었습니다.

 

 

정적인 웹사이트에서 덧글기능은 매우 필요한 기능입니다. 불편하긴 하지만 이렇게라도 사람들과 교류할 수 있는 기능이 있어서 정말 좋다 생각합니다.