Skip to main content

Adding Plugins to the Ghost Blog Platform

· 5 min read
tanzhuo

I originally wanted to integrate Disqus, the popular international commenting service, into Ghost so my blog could have a comment section. Being lazy, I decided to just use something other people had already built.

Background​

Ghost is a very clean blog platform — so clean that it doesn't even ship with comments. The official stance is clear: comments belong to the realm of third-party services, and a blogging platform should focus on content. I actually agree with this design. A comment system involves user identity, spam prevention, and data storage; maintaining one yourself is no small cost, and handing it off to a dedicated service saves a lot of headaches.

So the problem became: which commenting service to pick, and how to hook it into Ghost.

How Ghost Integrates Third-Party Comments​

Ghost has no plugin marketplace, but it leaves two doors open:

  1. Code Injection. In the admin settings you can insert a snippet of HTML/JS directly into the site-wide <head> or the end of <body>, without touching theme files. This is great for quickly trying out a commenting service.

  2. Editing the theme template. Put the commenting service's embed code into the theme's post.hbs post template, so it only loads on article pages. This is the more proper approach, and it gives you more control over where the comment section appears.

Third-party commenting services all integrate basically the same way: you place a placeholder div on the page and load a JS snippet; the script fetches comment data from the vendor's servers and renders it into the placeholder. Comment data lives on the vendor's side, fully decoupled from the blog itself.

Wiring Up Disqus​

Disqus is the most widely used commenting service outside China, and it's the example used in Ghost's official docs. I read through the documentation, and setup was dead simple: register an account, create a site to get your shortname, paste the embed code into the post template, and you're done.

Once everything was configured, it turned out things were not so simple after all.

The configuration did take effect — opening the blog on a network with unrestricted internet access, the comment section rendered fine. But on an ordinary network inside China, the spot where the comments should be was just blank. The reason was straightforward: Disqus's embed script and API domains are blocked in China, so the script never loads and the comment section never renders.

I was speechless.

For a Chinese-language blog whose readers are mostly in China, this is equivalent to having no comment feature at all. Worse, the failing script can also slow the page down: the browser sits there waiting until the request times out before giving up.

Weighing the Proxy Option​

A blocked service isn't necessarily hopeless. The popular approach in the community is to run your own reverse proxy: use your own server (or a CDN, or a serverless function) to relay requests to Disqus's API, and patch the embed script on the frontend to point at your proxy. That way, requests from users in China hit your proxy first, and the proxy talks to Disqus.

So my plan was to go find someone's ready-made proxy code on GitHub when I had time. Writing it myself would take a while; grabbing something off the shelf sounded pretty good.

But thinking it over calmly, this approach has a few unavoidable problems:

  • The proxy itself needs deployment and maintenance — you're effectively running an extra service just for a comment box;
  • The comment login/authorization flow also goes through Disqus, so the proxy has to handle more than one or two endpoints, and it's easy to miss some;
  • The free tier of Disqus comes with ads anyway.

Taking on all that burden just for comments isn't a great trade.

Switching to Valine​

-Updated 2019-12-19

In the end I went with Valine, a commenting system that works directly in China — ad-free and free to use.

Valine takes a different approach than Disqus: it has no backend service of its own. Comment data is stored on a BaaS platform like LeanCloud, and on the frontend you just include one JS file and fill in the App ID and App Key you registered. There's no forced login — visitors can leave a comment with just a nickname, which is plenty lightweight for a personal blog.

Integration works the same way as described above: drop the initialization code into your article pages via Code Injection or the theme template. There's no access issue from within China, and page loads no longer stall.

tip

Before choosing a commenting system, actually open the page once from your target readers' network environment. Plenty of services work perfectly on the developer's own network and behave completely differently elsewhere.

Wrapping Up​

The lesson from all this tinkering is simple: when picking a third-party service, put availability before features. However full-featured Disqus is, it's worth zero if your readers can't load it; Valine is bare-bones, but for a Chinese-language blog serving domestic readers it's the more pragmatic choice. Ghost's Code Injection mechanism keeps the switching cost low — a full round of trial and error only takes half a day.

COMMENTS