如何在github页面博客（Markdown）中使用disqus评论？

是否有可能使用github页面在博客中集成disqus的html评论？ 我喜欢使用github，jekyll和markdown来简化pipe理我的网站和博客的想法。 但是，我想包括disqus评论function。 但是，由于降价产生的HTML – 我如何包括分辨率的HTML / JS代码？

最简单最干净的方法是用disqus在你的_includes/文件夹（例如_includes/disqus.html ）中提供的HTML创build一个partial，然后将其包含在你的文章布局文件（例如_layouts/post.md ） ： 

 {% include disqus.html %}

你可以在这里看到一个例子： post layout和disqus partial 。

有一个“官方”的方式来完成这项任务。 你可以在这个链接findDisqus标识。

具体过程如下：

将一个名为comments的variables添加到YAML Front Matter （即您的发布文件的标题）中，并将其值设置为true 。 前面的示例可能如下所示： 

 layout: default comments: true # other options

创build一个新的模板文件（即disqus.html ），并在那里放置通用embedded代码 ， % if page.comments %和% endif %

将disqus.html文件包含到您的发布模板中。

希望能帮助到你 ：）

在你的post.html包含disqus评论，并设置评论计数链接的标识符： 

 <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>

这是真的Jekyll将从您的Markdown文件（本地使用Jekyll或远程推送到gh页）呈现HTML。 然而这并不重要，因为这种代码必须位于一个图层中，所以不在Markdown源文件中。 

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

通过遵循这个树视图，您可以使用可以包含Disqus脚本的post布局来呈现您的Markdown文件。

打开config.yml并添加以下代码行disqus_shortname: username 。 用您的Disqus短名称replaceusername 。

在Jekyll的_includes文件夹中创build一个名为disqus_comments.html的文件，并将您的Disqus通用embedded代码添加到{% if page.comments %}和{% endif %}液体标签之间 

 {% 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 %}

您只需在任何post的前面添加comments: false来closures该评论。

最后，打开你的post.html文件，在结尾</article>标签后面添加下面的液体包含标签。 

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

你可以按照我的详细的博客文章，如何joinDisqus评论杰基尔，如果你卡住了。

Interesting Posts