前往小程序,Get更优阅读体验!
立即前往
首页
学习
活动
专区
工具
TVP
发布
社区首页 >专栏 >给Rails应用添加Disqus

给Rails应用添加Disqus

作者头像
用户2183996
发布2018-06-28 11:05:12
3760
发布2018-06-28 11:05:12
举报
文章被收录于专栏:技术沉淀技术沉淀

Add Disqus to Your Website

Disqus is a pretty awesome tool for website comments. You just to need a little configuration to get things done. Here is a quick guide to add disqus to your rails app.

Disqus Account and Setting

Make sure you have an account, if not, go to disqus. Then go for setting and click Add Disqus To Site, choose a site name, unique disqus url and category. Next, choose universal code choice and you will be presented with some code, just copy it!

Create Disqus Partial

Say you need disqus for your post show page and you can just copy the code here, but it's not a good idea. You can use partial to simplify your view. Create _disqus.html.erb:

代码语言:javascript
复制
<div id="disqus_thread"></div>
<script>
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 = '//demo-yong.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" rel="nofollow">comments powered by Disqus.</a></noscript>

Then in your show.html.erb file, add this line of code <%= render 'disqus' %>, refresh your page, it should work.

Configuration

Comments and posts will get mixed if you don't add some identifier to disqus. You can add disqus.identifier, disqus.title and disqus.url etc. And after that, the partial should be something like this:

代码语言:javascript
复制
<div id="disqus_thread"></div>
<script>

var disqus_config = function () {
this.page.url = '<%= url_for([@post, {only_path: false}]) %>'; 
this.page.identifier = '<%= @post.id %>'; 
};

(function() { // DON'T EDIT BELOW THIS LINE
var d = document, s = d.createElement('script');

s.src = '//lyuyongle.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" rel="nofollow">comments powered by Disqus.</a></noscript>

戳这看效果

本文参与 腾讯云自媒体分享计划,分享自作者个人站点/博客。
原始发表:2016.06.27 ,如有侵权请联系 cloudcommunity@tencent.com 删除

本文分享自 作者个人站点/博客 前往查看

如有侵权,请联系 cloudcommunity@tencent.com 删除。

本文参与 腾讯云自媒体分享计划  ,欢迎热爱写作的你一起参与!

评论
登录后参与评论
0 条评论
热度
最新
推荐阅读
目录
  • Add Disqus to Your Website
  • Disqus Account and Setting
  • Create Disqus Partial
  • Configuration
领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档