DISQUS ( 댓글 기능 추가 )

MJ·2022년 7월 7일
0

[WEB 유틸리티]

목록 보기
2/5
post-thumbnail

1. DISQUS ?

  • 소셜 댓글 시스템
  • 구글이나 페이스북 같은 플랫폼에 댓글 기능을 추가해주는 서비스입니다.
  • 회원가입을 하지 않아도, SNS 계정만 있다면 댓글을 남길 수 있는 장점이 있습니다.

1.1 DISQUS 가입 및 적용하기

  1. https://blog.disqus.com/ 사이트 접속 후 회원 가입

  2. 절차 따라 하기
    SETTINGAdd Disqus To SiteI want to Install Disqus on my site
    웹사이트 이름 지정 카테고리 지정(Tech) → BASIC Subscribe Now → 플랫폼을
    선택하는 화면에서 사이트 하단에 Universal Code 클릭 후 소스코드를 복사해서
    HTML 문서에 붙여 넣습니다.

  3. HTML 문서에 소스코드 붙여넣기

 <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-velog-io-devp1023.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>
  1. 웹 브라우저에서 결과를 보면, 댓글기능이 추가된 것을 확인할 수 있습니다.

웹 서버를 통하지 않고, 파일 경로로 열어버리면 보안상의 이유로 서비스가 작동하지 않습니다.

profile
프론트엔드 개발자가 되기 위한 학습 과정을 정리하는 블로그

0개의 댓글