vuepress-plugin-disqus-comment

disqus-comment

Disqus is a platform that provides commenting used by hundreds of thousands of websites. This plugin simplifies adding Disqus to your VuePress site.

Install

First of all, you have to sign up for Disqus.

yarn add vuepress-plugin-disqus-comment -D
# OR npm install vuepress-plugin-disqus-comment -D

Usage

Take a look at Using a Plugin.

// .vuepress/config.js
module.exports = {
  plugins: [
    "vuepress-plugin-disqus-comment",
    {
      /* options */
    }
  ]
};

This plugin is based on vue-disqus. It has registered a global component - <vue-disqus/>. Just put it wherever you like, and Disqus will be embedded in the right place. For example:

<template>
  <div>
    <Content />
    <!-- ...... -->
    <vue-disqus />
  </div>
</template>

Or you can simply put it in your .md file.

## Hello VuePress

This is a demo.

<vue-disqus/>

Config

Below are the props mentioned in vue-disqus documentation. They're going to be used as Disqus configuration variables.

Prop Data Type required Description
shortname String true Your shortname disqus.
url String false Your URL where Disqus is present
title String false Title to identify current page.
identifier String false Your unique identifier
sso_config Object false Single sign-on (SSO)
api_key String false Your API key disqus
remote_auth_s3 String false implementation with Laravel/PHP
language String false Language overrides

Actually, They're also all the configuration options for this plugin. It allows you to config globally. What you config will be passed to every vue-disqus component. You're still able to override it by passing down props. Note that if you don't set language, it'll use VuePress's $lang as default language.

Demo