github 페이지 블로그 (마크 다운)에서 disqus 댓글을 어떻게 사용하나요?

github 페이지 블로그 (마크 다운)에서 disqus 댓글을 어떻게 사용하나요?

---

github-pages를 사용하여 disqus html 주석을 블로그에 통합 할 수 있습니까? 간단하게 사이트와 블로그를 관리하기 위해 github, jekyll 및 markdown을 사용하는 아이디어가 마음에 듭니다. 그러나 disqus 주석 기능을 포함하고 싶습니다. 그러나 markdown은 html을 생성하기 때문에 disqus에 html / js 코드를 어떻게 포함합니까?

---

가장 쉽고 깔끔한 방법은 disqus가 _includes/폴더 (예 :)에 제공하는 HTML로 부분을 _includes/disqus.html만든 다음 게시물 레이아웃 파일 (예 :)에 포함하는 것입니다 _layouts/post.md.

{% include disqus.html %}

여기에서 예제를 볼 수 있습니다 : 포스트 레이아웃 및 disqus partial .

---

이 작업을 수행하는 "공식적인"방법이 있습니다. 이 링크 에서 Disqus 표시를 찾을 수 있습니다 .

세부적으로 절차는 다음과 같습니다.

라는 변수 추가 comments받는 YAML 서문 (즉, 귀하의 게시물 파일의 헤더를)하고 해당 값을 설정합니다 true. 샘플 서문은 다음과 같습니다.

layout: default
comments: true
# other options

새 템플릿 파일 (예 :)을 만들고 a와 a 사이에 Universal Embed Code를disqus.html 넣으십시오 .% if page.comments %% endif %

disqus.html게시물 템플릿에 파일을 포함합니다 .

도움이되기를 바랍니다 :)

---

에 disqus 댓글을 포함하고 post.html댓글 개수 링크에 대한 식별자를 설정합니다.

<div id="disqus_thread"></div>
<script type="text/javascript">
    var disqus_shortname = '<your-disqus-name>'; 
    var disqus_identifier = '{{ page.id }}'; 
...
</script>

default.html템플릿에 댓글 개수 스크립트를 포함 하세요 .

<script type="text/javascript">
    /* * * CONFIGURATION VARIABLES: EDIT BEFORE PASTING INTO YOUR WEBPAGE * * */
    var disqus_shortname = '<your-disqus-name>';
...
</script>

그런 다음 data-disqus-identifier속성을 사용하여 댓글에 링크를 추가하면 블로그의 기본 페이지에서 각 게시물 다음에 댓글 수가 표시됩니다.

<a href="{{post.id}}" data-disqus-identifier="{{post.id}}">Leave a comment</a>

---

요약하면 :

1. 세 번째 댓글 서비스 Disqus 사용, 계정 생성
2. 사이트, 즉 github 사이트를 disqus와 연결
3. Disqus 닉네임 가져 오기 admin/settings/general/
4. github의 _config.yml을 편집하고 다음 내용이 포함되어 있는지 확인하십시오.

disqus:
    shortname: <your disqus short name>

5. disqus.html아래에 있는지 확인하십시오 _includes.

   {% if page.comments %}
   <div class="comments">
   <div id="disqus_thread"></div>
   <script type="text/javascript">
   var disqus_shortname = '{{ site.disqus.shortname }}';
   (function() {
   var dsq = document.createElement('script'); dsq.type = 'text/javascript'; dsq.async = true;
   dsq.src = '//' + disqus_shortname + '.disqus.com/embed.js';
   (document.getElementsByTagName('head')[0] || document.getElementsByTagName('body')[0]).appendChild(dsq); })();    
   </script>
   <noscript>Please enable JavaScript to view the <a href="http://disqus.com/?ref_noscript">comments powered by Disqus.</a></noscript>
   </div> 
   {% endif %}
   

   6. 포함 disqus.html에_layouts/post.html

   7. 댓글을 사용하려면 comments:true게시물에 yaml의 머리말을 추가 하세요. comments: false주석 옵션을 설정 하거나 포함하지 않음 으로써 비활성화하십시오 .

---

config.yml을 열고 다음 코드 줄을 추가합니다 disqus_shortname: username. usernameDisqus 닉네임으로 바꿉니다 .

Create a file called disqus_comments.html in Jekyll’s _includes folder and add your Disqus Universal Embed Code in between a {% if page.comments %} and a {% endif %} liquid tag

{% raw %}{% if page.comments != false %}
<div id="disqus_thread"></div>
<script type="text/javascript">
  var disqus_shortname  = '{{ site.disqus_shortname }}';
  var disqus_identifier = '{{ page.url }}';

  (function() {
    var dsq = document.createElement('script'); dsq.type = 'text/javascript'; dsq.async = true;
    dsq.src = '//' + disqus_shortname + '.disqus.com/embed.js';
    (document.getElementsByTagName('head')[0] || document.getElementsByTagName('body')[0]).appendChild(dsq);
  })();
</script>
<noscript>Please enable JavaScript to view the <a href="http://disqus.com/?ref_noscript">comments powered by Disqus.</a></noscript>
{% endif %}{% endraw %}

You simply add comments: false in any posts front-matter to turn off that post comments.

Finally, open your post.html file and add the following liquid include tag just after the end </article> tag.

{% if site.disqus_shortname %}
  {% include disqus_comments.html %}
{% endif %}

You can follow my detailed blog post on how to add Disqus comments to Jekyll if you get stuck.

---

That's true Jekyll will render HTML from your Markdown files (locally using Jekyll or remotely by pushing to gh-pages). However it doesn't really matter as this kind of code has to be in a layer, so not in the Markdown source file.

_layouts
    `- default.html
    `- post.html <- `layout: default` in the YAML header
_posts
    `- YYYY-MM-DD-my-post.md <- `layout: post` in the YAML header

By following this tree view, you'll able to render your Markdown files by using your post layout, which can contain your Disqus script.

참고URL : https://stackoverflow.com/questions/21446165/how-do-i-use-disqus-comments-in-github-pages-blog-markdown