Kunjungi Blog terbaru saya corkismet - Coretan Kang Ismet - dan tinggalkan jejak sobat disana.

Mengganti Komentar Disqus dengan Komentar Facebook pada Blog AMP

Cara lengkap mengganti Komentar Disqus dengan Komentar FB
How to switch Disqus Comments Sytem to Facebook Comments System - Kolom Komentar adalah sarana komunikasi antara pemilik Web/Blog dengan pengunjung. Namun tentunya sistem komentar yang digunakan tergantung selera pemilik Blog itu sendiri. Seperti Blog dengan Platform Blogspot, ada yang menggunakan Komentar bawaan, ada yang menggunakan Disqus atau Facebook.

Seiring berkembangnya AMP HTML, maka sering saya lihat menggunakan Komentar Disqus yang valid AMP. Nah bagai mana kalau ingin merubahnya?

Pada postingan kali ini saya akan memberikan tutorial Bagaimana Merubah Komentar Disqus Menjadi Komentar FB. Untuk DEMO, silahkan menuju komentar di bawah. Sebelum menuju tutorial, siapkan kopinya biar santai 😃

1. Langkah Pertama

Simpan JavaScript Facebook Comments di atas </head>
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<script async='async' custom-element='amp-facebook-comments' src='https://cdn.ampproject.org/v0/amp-facebook-comments-0.1.js'/>
</b:if>

2. Langkah ke-Dua

Cari kata kunci disqus, maka sobat akan menemukan kode seperti ini


2. Langkah ke-Tiga

Perhatikan gambar di atas, lihat kode yang di blok, mulai
<amp-iframe........ sampai </amp-iframe>
ganti dengan kode ini:
<amp-facebook-comments
  width='600'
  height='180'
  layout='responsive'
  data-numposts='10'
  data-locale='id_ID'
  data-order-by='reverse_time'
  expr:data-href='data:post.url'>
</amp-facebook-comments>

4. Kode Opsional

Dari HTML di atas, data-locale='id_ID' bisa dicantumkan ataupun tidak. Kemudian untuk menampilkan Komentar Terlama ke Terbaru, maka edit data-order-by='reverse_time' menjadi data-order-by='time'

Sampai saat ini, Facebook hanya menyediakan Tema Light. Tema Dark Belum tersedia. Entah dari AMPnya atau dari facebooknya.

Moderasi Komentar


Untuk bisa memoderasi komentar, sobat harus membuat Aplikasi Facebook melalui Facebook Developer. Setelah mendapatkan ID Aplikasi, simpan meta tagnya di blog sobat.
<meta content='123456789' property='fb:app_id'/>
Ganti 123456789 dengan ID Aplikasi yang sobat buat.

Selamat Mencoba.....

Untuk mendapatkan update terbaru di Dasbor Blogger, silahkan ikuti Blog ini

2 komentar

1. Komentar ini, diurutkan dari yang terbaru
2. Tinggalkan komentar sesuai topik tulisan
3. Apabila ada pertanyaan diluar artikel silahkan kunjungi Ruang Obrolan.
4. Centang Beri tahu saya untuk mendapatkan notifikasi via Email ketika ada balasan
Masukkan URL Gambar atau Potongan Kode, atau Quote, lalu klik tombol yang kamu inginkan untuk di-parse. Salin hasil parse lalu paste ke kolom komentar.


image quote pre code
  1. Tapi kang Ismet kok ndak pakai komentar Facebook. Saya ndak jadi pakai juga deh, hehehe
    1. loadingnya lumayan berat mas hehe.. kemaren sempet pake di halaman ini
Cookie Consent
We serve cookies on this site to analyze traffic, remember your preferences, and optimize your experience.
Oops!
It seems there is something wrong with your internet connection. Please connect to the internet and start browsing again.
AdBlock Detected!
We have detected that you are using adblocking plugin in your browser.
The revenue we earn by the advertisements is used to manage this website, we request you to whitelist our website in your adblocking plugin.
Site is Blocked
Sorry! This site is not available in your country.