Disqus comments plugin for Metalsmith.
JavaScript
Latest commit 0c5cc51 Jan 11, 2017 @vitaliy-bobrov 1.2.2
Permalink
Failed to load latest commit information.
lib
.gitignore add missed deps Dec 28, 2016
LICENSE.md add readme Dec 29, 2016
README.md
package.json 1.2.2 Jan 11, 2017

README.md

metalsmith-disqus

A Metalsmith plugin that adds Disqus commenting widget and counter scripts.

Installation

$ npm install --save-dev metalsmith-disqus

Usage

Place metalsmith-disqus plugin after html files generation, for example after metalsmith-layouts.

const Metalsmith = require('metalsmith');
const disqus     = require('metalsmith-disqus');

Metalsmith(__dirname)
  ...
  .use(disqus({
    siteurl: 'my-site.com',
    shortname: 'my-site'
  }));

In your templates you need to add <div id="disqus_thread"></div> for commenting widget. For comments counter add element with class name disqus-comment-count and data attribute data-disqus-key with renedered key to generate id.

Examples:

Page with comments template using handlebars:

  <p>Your page markup<p>
  {{#if comments }}
  <!-- Comments widget will be rendered in this element -->
  <div id="disqus_thread"></div>
  {{/if}}

Page with counters template using handlebars:

  <p>Your page markup<p>

  {{#if comments }}
  <!-- Comments counter will be rendered in this element -->
  <span class="disqus-comment-count" data-disqus-key="{{title}}"></span>
  {{/if}}

To enable comments for page just add comments: true to page metadata. Example:

  ---
  title: Hello World
  comments: true
  ---

To enable comments counter for page just add comments-counter: true to page metadata. Example:

  ---
  title: Post
  comments-counter: true
  ---

To add Disqus DNS prefetch for entry page, for example homepage just add disqus-dns-prefetch: true to page metadata. It will speed up disqus scripts loading. Example:

  ---
  title: My home page
  disqus-dns-prefetch: true
  ---

To add Disqus scripts prefetch for page just add disqus-prefetch-widget: true (for comments widget script) or disqus-prefetch-counter: true (for counter script) to page metadata. It will speed up disqus scripts loading. Example:

  ---
  title: My home page
  disqus-prefetch-widget: true
  disqus-prefetch-counter: true
  ---

Counter class name selector can be configured with options.

Options

siteurl - Required

Type: String

Default: ''

Your site url, used to generate page url in Disqus configuration.

shortname - Required

Type: String

Default: ''

Your site short name configured in Disqus, used to generate page url in Disqus configuration.

path

Type: String

Default: 'path'

Propery key in file metadata to get page path, used to generate page url in Disqus configuration. By default uses path property that metalsmith-permalinks plugins adds.

title

Type: String

Default: 'title'

Propery key in file metadata to get page title, used as page title in Disqus configuration.

identifier

Type: String

Default: 'title'

Propery key in file metadata to generate page identifier, used as page identifier in Disqus configuration.

counterSelector

Type: String

Default: '.disqus-comment-count'

CSS selector string to find elements in page template inside whitch insetr comments counter.

CLI

You can also use the plugin with the Metalsmith CLI by adding a key to your metalsmith.json file:

{
  "plugins": {
    "metalsmith-disqus": {
      "siteurl": "my-site.com",
      "shortname": "my-site"
    }
  }
}

License

MIT