Deep Dive

“The fastest auto dealership site in the world” Hundreds of hours of perf learnings, distilled

ContactSign Up for Free
Community Plugin
View plugin on GitHub

Gatsby Plugin Disqus

A plugin that simplifies the process of integrating Disqus comments within your Gatsby website.

Install

$ yarn add gatsby-plugin-disqus
or
$ npm install -S gatsby-plugin-disqus

Configure

Add the plugin to your gatsby-config.js file with your Disqus shortname

// gatsby-config.js
module.exports = {
  plugins: [
    {
      resolve: `gatsby-plugin-disqus`,
      options: {
        shortname: `your-disqus-shortname`
      }
    },
  ]
}

Usage

The plugin can be used as shown in this brief example:

import Disqus from 'gatsby-plugin-disqus'

const PostTemplate = () => (
  <>
    /* Page Contents */
    <Disqus 
      identifier={post.id}
      title={post.title}
      url={`${config.siteUrl}${location.pathname}`}
    />
  </>
)

export default PostTemplate

While providing an identifier, title, and url are optional, it is recommended as it will ensure that threads won’t be lost in the case that the post is renamed or the domain changes.

How to contribute

If you have unanswered questions, would like help with enhancing or debugging the plugin, feel free create an issue or submit a pull request

© 2022 Gatsby, Inc.