vuejs,

Menambahkan Plugin Disqus di Gridsome

Ham Ham Follow Apr 21, 2020 · 1 min read
Menambahkan Plugin Disqus di Gridsome
Share this

Kolom komentar menjadi salah satu komponen penting dalam suatu blog, karena disinilah kita bisa berkomunikasi dengan pembaca dan pembaca bisa memberikan respon terhadap apa yang kita publikasikan.

Beberapa starter template Gridsome memang sudah dilengkapi kolom komentar dengan Disqus, tapi banyak yang belum ada dan kita harus menambahkannya sendiri.

Berikut ini cara menambahkan plugin Disqus di Gridsome.

Install plugin Disqus

Pertama install terlebih dahulu plugin Disqus dari repository, untuk pengguna yarn silahkan masukan perintah berikut.

yarn add gridsome-plugin-disqus

Untuk pengguna npm

npm install gridsome-plugin-disqus

Pemasangan Plugin

Tambahkan plugin ke gridsome.config.js seperti berikut ini

module.exports = {
  plugins: [
    {
      use: "@gridsome/gridsome-plugin-disqus"
    }
  ]
};

Lalu lakukan import pada main.js seperti berikut ini

import Vue from 'vue'
import VueDisqus from 'vue-disqus'

Vue.use(VueDisqus)
...

Terakhir tambahkan ke komponen blog Vue yang ada di websitemu

<div class="post-comments">
  <vue-disqus
    shortname="shortname_disqusmu"
    :identifier="$page.post.title"
  ></vue-disqus>
</div>

Ubah shortname_disqusmu dengan shortname punya kalian.

Itulah cara memasang plugin Disqus di Gridsome. Untuk lebih lengkap bisa cek langsung di repository Vue-disqus.

Dapatkan Update
Dapatkan update artikel dengan mudah, cukup masukkan emailmu aja!
Ham
Ham Follow
Hi, saya Ham, semoga artikel yang saya bagikan bermanfaat