在Ghost上使用Disqus

開始使用ghost後, 發現他沒有評論功能...

在Ghost上使用Disqus

0x00 前言

開始使用ghost後, 發現他沒有評論功能(雖然也沒人會評論

但官方應該有教學吧? google之後發現真的有 Document

但使用上實在太過於麻煩了, 去修改post.hbs ????

我用docker架設的, 不打算更動任何theme的東西


0x01 解決方法

在Google之後又發現了一篇文章
Using Disqus with your managed Ghost blog
只需要在Ghost's Code Injection裡面的Blog footer

加上這段script

<script id="disqus-script" data-disqusName="your-disqus-name"
  data-element="selector-of-element-where-to-append-disqus-container"
src="https://cdn.rawgit.com/paulwellnerbou/a09e3819307851993df0aba65b266e86/raw/ee408decdfbb8df5180894741dc59a5423d706a6/embed-disqus.js"/>

這是原始碼

需要更改的地方有

data-disqusName="your-disqus-name"
data-element="selector-of-element-where-to-append-disqus-container"

data-disqusName就是你註冊的disqus帳號

data-element則是你想要插入在哪裡
例如你想要append到這個element的下面

<article class="post-full post tag-ghost-tag tag-disqus tag-simplifying-things no-image">
....
</article>

那就是article.post-full
另外只有static的article element裡面有.page這個class
我不想讓static頁面出現disqus
所以後面多加了not(.page)

data-element="article.post-full:not(.page)"

這樣就完成了


0x02 結語

雖說很好用, 但缺點就是假如url有改變的話評論就會消失
然而還是比官方教學方便太多
感謝 Paul Wellner Bou