Cara menambahkan komentar Facebook untuk Blogger dengan notifikasi
Pelajari cara menambahkan komentar Facebook ke Blogger dengan notifikasi diaktifkan. Itu berarti Anda akan menerima pemberitahuan instan setiap kali seseorang berkomentar di blog Blogspot Anda.
Plus, Anda menambahkan beberapa moderator komentar sehingga Anda dapat berkolaborasi dengan rekan satu tim dan menghabiskan waktu Anda bekerja dengan pengaturan SEO Blogger untuk meningkatkan lalu lintas dan menghasilkan pendapatan yang baik dari BlogSpot.
Mengapa Plugin Komentar Facebook?
Kotak komentar Facebook adalah salah satu plugin Facebook teratas yang digunakan di banyak situs web dan blog.
Plugin komentar Facebook telah menjadi alat yang sangat baik untuk meningkatkan komentar berkualitas dan keterlibatan pengguna. Saat Anda menggunakan kotak komentar Facebook di situs web Anda, Anda dapat mengurangi komentar spam dan menjaga kualitas komentar Anda .
Keuntungan lain menggunakan plugin komentar Facebook dibandingkan yang lain adalah Facebook memungkinkan orang untuk membagikan komentar mereka di timeline mereka.
Jadi, jika Anda telah memasang kotak komentar Facebook di blog BlogSpot Anda, Anda juga dapat mengharapkan lalu lintas yang layak dari komentar tersebut.
Beruntung bagi Anda, sekarang mesin pencari, terutama Google, merayapi dan mengindeks konten di komentar Facebook.
Apa artinya itu bagi Anda?
Ketika blog Anda menerima lebih banyak komentar, mesin pencari akan merayapi konten di dalam komentar dan menambahkannya ke indeks pencarian. Jadi, blog Anda akan mendapatkan lebih banyak lalu lintas dari mesin pencari ke blog Anda.
Itu sangat bagus bukan?
Ya, biasanya, komentar Facebook mendapatkan lebih banyak keterlibatan. Anda dapat mengharapkan peningkatan lalu lintas dalam beberapa hari mendatang. Tapi, itu tidak dijamin.
Saya membagikan posting terperinci tentang menambahkan kotak komentar Facebook ke Blogger dengan pemberitahuan yang diaktifkan di posting sebelumnya. Postingan itu mendapat banyak komentar ketika Facebook memutuskan untuk mengubah desainnya. Masalah utama banyak blogger adalah bagaimana membuat aplikasi Facebook dan menambahkan kotak komentar Facebook ke Blogger dengan antarmuka baru mereka.
Jadi, saya memutuskan untuk mengambil semua langkah itu di pundak saya dan menunjukkan kepada Anda bagaimana cara menambahkan komentar Facebook ke blog BlogSpot mana pun.
Oleh karena itu, dalam tutorial ini, saya akan menjelaskan cara menambahkan kotak komentar Facebook baru ke Blogger dengan notifikasi. Di akhir tutorial ini, Anda dapat menyematkan plugin komentar Facebook ke blog BlogSpot Anda dan mendapatkan pemberitahuan untuk setiap komentar dan balasan secara instan.
Jika Anda menghabiskan cukup banyak waktu di Facebook, fitur ini akan sangat membantu.
Keuntungan lainnya adalah Anda dapat menambahkan moderator untuk mengelola komentar. Meskipun Anda tidak online saat ini, moderator yang Anda tetapkan dapat memoderasi komentar.
Tanpa basa-basi lagi, mari kita mulai menambahkan kotak komentar Facebook baru ke blog Blogger Anda. Tutorial ini memiliki tiga bagian penting. Mereka,
- Buat aplikasi untuk blog Anda
- Plugin Komentar Facebook Instan
- Aktifkan notifikasi untuk komentar
- Moderasi komentar (opsional, bagian selanjutnya setelah menambahkan kotak komentar Facebook)
Anda juga akan belajar bagaimana:
- Tampilkan jumlah komentar Facebook di setiap posting blog
- Nonaktifkan formulir komentar Blogger default
- Kembangkan bisnis Anda ke level selanjutnya
Saya akan menjelaskan setiap langkah satu per satu. Silakan ikuti setiap langkah dengan benar.
Kelebihan Plugin Pitiya Facebook Comments untuk Blogspot
Berikut adalah beberapa alasan mengapa plugin komentar Pitiya Facebook untuk Blogger adalah yang terbaik untuk blog Anda.
- Tidak berbasis Jquery! – Tidak berdampak pada waktu pemuatan situs web Anda
- Dua tema – untuk tema Blogger Terang dan Gelap.
- Banyak pilihan Kustomisasi
- Pembaruan reguler pada kode: Kami akan memperbarui kode secara berkala untuk beradaptasi dengan perubahan kode SDK Facebook. Kami akan menangani mereka semua!
- Widget penghitung komentar
- Fitur baru ditambahkan secara teratur
- Pemberitahuan instan ke akun Facebook Anda
- Banyak admin untuk memoderasi komentar
- Ini 100% gratis!
Buat Aplikasi Facebook
Catatan: Tergantung waktunya, desain halaman pengembang Facebook mungkin telah berubah. Tapi, langkahnya sama. Buat aplikasi baru >> masukkan detail bisnis & situs web Anda >> Jadikan publik.
Ikuti petunjuk di bawah ini untuk mulai membuat Aplikasi Facebook untuk menerima pemberitahuan ke akun Facebook Anda untuk komentar dan balasan baru.
Buka halaman web resmi Aplikasi Pengembang Facebook dan klik area “ Tambah Aplikasi Baru ”. Atau, Anda dapat mengarahkan kursor ke tautan menu "Aplikasi Saya" dan memilih tombol "Buat Aplikasi Baru".
Buka Pengaturan dasar untuk mulai menambahkan detail tersebut. (Pastikan Aplikasi yang benar dipilih)
Misalnya, menambahkan URL privasi situs web bukanlah opsional. Anda harus menambahkannya. Dan mungkin ada beberapa bidang yang harus mematuhi GDPR. Jika blog BlogSpot Anda tidak memiliki halaman Kebijakan Privasi, Anda harus membuatnya sekarang. Anda dapat membuat sendiri, menyewa pengacara untuk melakukannya untuk Anda atau menggunakan templat kebijakan privasi.
Beruntung bagi Anda, ada beberapa pembuat kebijakan privasi untuk blog Blogger. Cari di google dan Anda akan menemukannya.
Setelah mengisi kolom di pengaturan Dasar, buat aplikasi Facebook Anda menjadi publik dengan mengaktifkan tombol aktif (periksa langkah 2 dari tangkapan layar di bawah). Pastikan Anda telah menentukan URL situs web yang akan Anda pasang plugin komentar Facebook.
Satu langkah terakhir…
..Buka Dasbor Aplikasi Facebook Anda dan simpan id aplikasi dan rahasia aplikasi di komputer Anda. Kami membutuhkan mereka nanti.
Instal Plugin Komentar Facebook
Sekarang Anda membuat aplikasi Facebook baru untuk Blog Anda. Hal berikutnya yang harus Anda lakukan adalah memasang plugin komentar Facebook di blog BlogSpot Anda. Untuk melakukannya, silahkan ikuti langkah-langkah di bawah ini masing-masing.
Langkah 1 : Masuk ke akun Blogger Anda dan buka bagian Tema.
Langkah 2 : Sekarang, Anda harus membuat beberapa perubahan pada tema blog Anda. Jadi sebelum kita mulai melakukan perubahan, pertama-tama buatlah backup dari template blog Anda yang sudah ada. Kemudian klik tombol “Edit HTML”.
Langkah 3: Temukan kode “<html” ini di template Anda dan di depan kode ini, rekatkan kode di bawah ini.
xmlns:fb='http://www.facebook.com/2008/fbml'Pastikan untuk menambahkan spasi sebelum dan sesudah kode di atas. Lihat contoh di bawah ini.
<html xmlns:fb='http://www.facebook.com/2008/fbml' b:version='2' class='v2' expr:dir='data:blog.languageDirection' xmlns='http://www.w3.org/1999/xhtml' …….. xmlns:expr='http://www.google.com/2005/gml/expr'>Langkah 4 : Gunakan pintasan keyboard CTRL + F Blogger dan temukan di mana elemen HTML di bawah ini berada.
</head>
Sekarang salin dan tempel di bawah blok kode tepat di atas kode </head>.
<meta expr:content='data:blog.pageTitle' property='og:title'/> <meta expr:content='data:blog.url' property='og:url'/> <meta content=' Pitiya ' property='og:site_name'/> <meta content='
Image-Address-Of-Blog-Logo ' property='og:image'/> <meta content=' YOUR_APP_ID ' property='fb:app_id'/> <meta content=' Your_FB_Acc_ID ' property='fb:admins'/> <meta content='article' property='og:type'/>Kustomisasi
- Ganti judul blog atau nama blog Anda, bukan Pitiya
- Salin dan tempel URL gambar logo sebagai gantinya Image-Address-Of-Blog-Logo . Logo akan muncul di sebelah judul posting Anda di profil komentator Facebook.
- Ganti YOUR_APP_ID dengan App ID yang Anda simpan di komputer sebelumnya.
- Ganti Your_FB_Acc_ID dengan ID numerik pribadi Facebook Anda. Anda bisa mendapatkannya di sini.
Tambahkan lebih banyak tag meta fb:admin untuk menetapkan beberapa admin.
<meta expr:content='data:blog.pageTitle' property='og:title'/> <meta expr:content='data:blog.url' property='og:url'/> <meta content='Pitiya' property='og:site_name'/> <meta content='Image-Link-Of-Blog-Logo' property='og:image'/> <meta content='YOUR_APP_ID ' property='fb:app_id'/> <meta content=' FB_Acc_ID_User1 ' property='fb:admins'/> <meta content=' FB_Acc_ID_User2 ' property='fb:admins'/> <meta content=' FB_Acc_ID_User3 ' property='fb:admins'/> <meta content='article' property='og:type'/>
Langkah 5: Temukan kode HTML di bawah ini menggunakan pintasan keyboard di atas.
<body>Jika Anda tidak dapat menemukan kode di atas di template blogger Anda yang ada, coba cari kode di bawah ini. Itu harus ditempatkan di template Anda.
<body expr:class='"loading" + data:blog.mobileClass'Setelah salah satu kode di atas, rekatkan potongan kode di bawah ini.
<div></div> <script> window.fbAsyncInit = function() { FB.init({ appId : ' MY APPLICATION ID HERE ', status : true, // check login status cookie : true, // enable cookies to allow the server to access the session xfbml : true // parse XFBML }); }; </script> <script src="https://d1usxgweuglwuz.cloudfront.net/files/pitiyafbcp.js"></script>Pastikan untuk mengganti ID APLIKASI SAYA DI SINI dengan ID aplikasi Facebook asli yang Anda salin sebelumnya.
Langkah 6: Sekarang Anda sudah setengah selesai. Anda perlu menampilkan kotak komentar Facebook di blog Anda. Anda dapat menempatkan kotak komentar Facebook di postingan dan halaman statis Anda secara manual. Tetapi tidak mudah untuk menambahkan kotak komentar Facebook ke seluruh halaman secara manual (pikirkan jika Anda memiliki 1000+ posting di blog Anda. Apakah Anda ingin menambahkan skrip plugin komentar Facebook di setiap posting? Saya rasa tidak.)
Jadi kami menggunakan teknik untuk menyematkan plugin komentar Facebook di bawah setiap halaman blog Blogger Anda, sehingga setiap kali Anda membuat posting blog baru, formulir komentar Facebook akan muncul.
Ini benar-benar dilakukan secara otomatis. Untuk mulai menambahkan kotak komentar Facebook, cari salah satu tag data Blogger ini di tema atau template Blogger Anda.
<data:post.body/>atau
<p><data:post.body/></p>
Jika Anda menggunakan template blogger majalah, Anda akan menemukan dua atau tiga kode serupa. Menggunakan kode <data:post.body/> yang salah dapat mengakibatkan plugin komentar Facebook tidak berfungsi dengan benar.
Jadi coba semua langkah kode dan pilih yang benar. Jika Anda tidak yakin kode mana yang akan ditambahkan atau tidak berfungsi dengan metode itu, temukan kode HTML di bawah ini di template Anda.
<div class='post-footer-line post-footer-line-1′>atau
<p class='post-footer-line post-footer-line-1′>Saya menemukan kode yang tepat dengan mudah. Periksa tangkapan layar di bawah ini.
Langkah 7 : Sekarang rekatkan salah satu potongan kode HTML kotak komentar Facebook tepat di bawah kode di atas.
Catatan : Kami mendesain ulang cara kerja plugin komentar Facebook untuk Blogger. Silakan periksa demo dengan mengklik tombol di bawah ini untuk melihat contoh dalam aksi langsung. Plugin komentar Facebook tidak bergantung pada JQuery, yang berarti kecepatan halaman Anda tidak akan berkurang banyak setelah menginstal plugin!
Tambahkan komentar Facebook ke Blogger dengan menempelkan cuplikan kode. Silakan periksa di bawah ini untuk mendapatkan kode.Gaya Plugin Komentar Facebook #1
Ini adalah gaya kotak komentar Facebook biasa. Jika Anda tidak menginginkan widget mewah, maka ini adalah yang terbaik untuk Anda. Ya, Anda dapat menyesuaikan pesan teks, warna, dll.! Lihat demo dengan mengklik tombol di bawah ini dan tinggalkan dan beri komentar untuk melihat cara kerjanya!
Dapatkan kode untuk widget komentar Facebook gaya 1 untuk Blogger di bawah ini.
<script> var bgcolor = '#f9f9f9', // background color textclr = 'inherit', //text color for custom text under Facebook comments form section titlecolor = '#444649', // title color titlefontsize = '33px'; // font size for title titlebgcolor = '#f9f9f9'; //ex: red, #ae85a8, titlefontfamily = 'Verdana, Geneva, sans-serif'; // ex: "Arial Black", Gadget, sans-serif </script> <b:if cond='data:blog.pageType == "item"'> <!-- Post pages --> <div id='pitiyafbcp'> <div id='titlefix'>Share What You Think About This Post!</div> <div id='fbcf'> <fb:comments data-colorscheme='light' data-numposts='10' data-width='500' expr:href='data:post.url' expr:title='data:post.title' expr:xid='data:post.id'/> </div> <div id='collector'/> </div> <b:else/> <b:if cond='data:blog.pageType == "static_page"'> <!-- static pages --> <div id='pitiyafbcp'> <div id='titlefix'>Share What You Think About This Page!</div> <div id='fbcf'> <fb:comments data-colorscheme='light' data-numposts='10' data-width='500' expr:href='data:post.url' expr:title='data:post.title' expr:xid='data:post.id'/> </div> <div id='collector'/> </div> </b:if> </b:if>
Gaya Plugin Komentar Facebook #2
Jika Anda ingin membuat bagian komentar blog Anda indah, indah dan tentu saja menyenangkan!, maka Anda tidak dapat mengabaikan plugin komentar Facebook yang indah ini untuk Blogger.
Keindahan gaya ini adalah hanya bergantung pada animasi CSS3 tertentu sehingga tidak memperlambat kecepatan situs web. Dan selanjutnya, Anda dapat mengubah warna agar lebih sesuai dengan template Blogger Anda saat ini. Lihatlah tampilannya dengan melihat demo.
Dapatkan kode untuk Style #2 dari plugin komentar Pitiya Facebook di bawah ini.
<style> #pitiyafbcp { color: #fff; background: linear-gradient(-45deg, #212122, rgba(99, 95, 97, 0.979), rgba(59, 60, 61, 0.986), rgb(12, 12, 12)); background-size: 400% 400%; -webkit-animation: Gradient 15s ease infinite; -moz-animation: Gradient 15s ease infinite; animation: Gradient 15s ease infinite; } @-webkit-keyframes Gradient{0%,100%{background-position:0 50%}50%{background-position:100% 50%}}@-moz-keyframes Gradient{0%,100%{background-position:0 50%}50%{background-position:100% 50%}}@keyframes Gradient{0%,100%{background-position:0 50%}50%{background-position:100% 50%}} </style> <script> var //bgcolor = '#f9f9f9', // background color textclr = 'inherit', //text color for custom text under Facebook comments form section titlecolor = '#444649', // title color titlefontsize = '33px'; // font size for title //titlebgcolor = '#f9f9f9'; //ex: red, #ae85a8, titlefontfamily = 'Verdana, Geneva, sans-serif'; // ex: "Arial Black", Gadget, sans-serif </script> <b:if cond='data:blog.pageType == "item"'> <!-- Post pages --> <div id='pitiyafbcp'> <div id='titlefix'>Share What You Think About This Post!</div> <div id='fbcf'> <fb:comments data-colorscheme='light' data-numposts='10' data-width='500' expr:href='data:post.url' expr:title='data:post.title' expr:xid='data:post.id'/> </div> <div id='collector'/> </div> <b:else/> <b:if cond='data:blog.pageType == "static_page"'> <!-- static pages --> <div id='pitiyafbcp'> <div id='titlefix'>Share What You Think About This Page!</div> <div id='fbcf'> <fb:comments data-colorscheme='light' data-numposts='10' data-width='500' expr:href='data:post.url' expr:title='data:post.title' expr:xid='data:post.id'/> </div> <div id='collector'/> </div> </b:if> </b:if>Kustomisasi
- Umumnya, kotak komentar Facebook akan muncul di halaman posting dan stasioner. Halaman stasioner atau statis adalah halaman yang berdiri sendiri. Mereka tidak ditambahkan ke arsip. Biasanya, halaman Statis paling baik untuk menambahkan halaman hubungi kami di Blogger, Tentang halaman, dll. Jadi jika Anda tidak ingin menampilkan kotak komentar Facebook di halaman statis, harap hapus bagian kode di atas yang dimulai dengan <b:if cond=' data:blog.pageType == “static_page”'>.
- Jika template Blogger Anda bukan template majalah atau dirancang untuk menampilkan seluruh konten di halaman beranda, maka Anda juga dapat menampilkan kotak komentar Facebook di halaman beranda blog atau halaman arsip.
- Ubah warna latar belakang dan font dengan mengubah nilai warna RGB dan Hex.
- Saya telah mengatur lebar kotak komentar menjadi 700 piksel. Jika Anda ingin mengurangi lebar hingga 500 piksel, perbarui nilainya menjadi 500 alih-alih 700. Selain itu, Anda dapat menghapus kode CSS data-width='700', lalu kotak komentar Facebook akan menyesuaikan dengan resolusi layar perangkat . Ingat, menambahkan nilai utama untuk lebar kotak komentar Facebook dapat mengacaukan template blog Anda.
- Selain itu, Anda dapat menambahkan ajakan bertindak Anda sendiri alih-alih "Berbagi Apa yang Anda Pikirkan!". Tambahkan yang cocok yang dikenal audiens Anda.
- Sesuaikan gaya plugin komentar menggunakan CSS.
Langkah 8 : Bagian terpenting dari tutorial ini, Simpan template Blogger Anda!
Aktifkan notifikasi untuk komentar
Sekarang Anda sudah menyelesaikan hampir semua pekerjaan yang paling melelahkan! Anda dapat mengabaikan langkah-langkah ini jika Anda tidak ingin menerima pemberitahuan untuk komentar & balasan dan membuat beberapa perubahan yang berguna seperti mengaktifkan filter tata bahasa, daftar putih anggota, dll. Tapi tutorial ini untuk menerima pemberitahuan untuk komentar. (Itulah sebabnya kami membuat Aplikasi Facebook!). Di bagian terakhir dari tutorial ini, mari kita lihat cara mengaktifkan notifikasi untuk komentar.
Kunjungi halaman web ini:
https://developers.facebook.com/tools/comments/?id= YOUR_APP_ID
Ganti YOUR_APP_ID dengan ID aplikasi Facebook Anda.
Klik tautan "Pengaturan".
Sekarang kotak pop-out akan ditampilkan, dan Anda dapat mengubah beberapa pengaturan. Jadikan diri Anda sebagai moderator (penting untuk menerima pemberitahuan komentar). Izinkan opsi lain untuk masuk dan berkomentar di blog Anda. Setel filter tata bahasa untuk menjaga kualitas komentar. Gunakan komposer komentar untuk mengurangi waktu pemuatan halaman.
Lihat tangkapan layar di bawah ini. Setelah melakukan perubahan ini, klik tombol "Simpan".
Itu saja. Setiap kali seseorang memberikan komentar, bahkan membalas komentar Anda sendiri di blog Anda, Anda akan menerima pemberitahuan Facebook INSTAN! . Beritahu teman untuk memberikan komentar di blog Anda untuk melihat hasilnya! Berikut adalah pesan pemberitahuan untuk komentar pengujian saya, yang dijatuhkan di situs demo.
Tampilkan penghitung komentar
Sekarang Anda telah menyelesaikan langkah terpenting dalam tutorial ini. Jika Anda ingin menampilkan jumlah komentar di bawah judul posting, ikuti petunjuk di bawah ini.
- Di halaman 'Edit HTML' Tema, cari kode di bawah ini.
<b:if cond='data:post.title'>- Sekarang salin dan tempel potongan kode tepat di bawah tag </b:if> kode di atas. (periksa tangkapan layar di bawah)
<span expr:href='data:post.url'></span> comments
Sembunyikan formulir Komentar Blogger Default
Jika Anda tidak tertarik untuk menampilkan formulir komentar Blogger dan formulir komentar Facebook di blog Anda, maka Anda dapat dengan mudah menonaktifkan sistem komentar default.
Komentar Sedang
Jika Anda mengikuti setiap langkah dengan benar, saat Anda mengunjungi entri blog mana pun yang mengaktifkan komentar Facebook, dan Anda masuk ke akun Facebook, Anda akan melihat tautan untuk memoderasi komentar. (Ini dikenal sebagai alat moderasi komentar Facebook.)
Kunjungi URL ini untuk membuka halaman Moderasi Komentar berdasarkan level Aplikasi:
https://developers.facebook.com/tools/comments/YOUR_APP_ID/
Ganti Your_APP_ID dengan ID aplikasi yang Anda gunakan untuk blog Anda.
Alat moderasi komentar Facebook tidak muncul
Jika alat moderasi komentar Facebook tidak muncul di pihak Anda, ikuti petunjuk di bawah ini.
- Pastikan Anda telah menambahkan ID APLIKASI yang akurat ke kode HTML komentar Facebook.
- Bersihkan cache browser Anda dan masuk ke Facebook akun Anda.
- Nonaktifkan plugin AdBlock
- Coba lagi dari browser yang berbeda.
Tindakan selanjutnya…
Sekarang Anda tahu cara menambahkan komentar Facebook ke Blogger.
Namun, Memasang plugin komentar Facebook di blog Blogspot Anda hanyalah bagian dari permainan besar. Memasang kotak komentar FB tidak mengkonfirmasi kesuksesan Anda dalam blogging. Anda telah pintar, mengikuti strategi yang baik, dan memiliki rencana untuk mengembangkan blog BlogSpot Anda dan mencapai tujuan akhir Anda.
Apakah Anda TIDAK ingin bekerja keras selama itu untuk melihat kemajuan dalam bisnis Anda? (Blog Anda = bisnis Anda)
Apakah Anda ingin menjalankan bisnis Anda dengan autopilot tanpa khawatir atau kesulitan?
Dengan kata lain, apakah Anda TIDAK ingin bergantung pada orang lain, terutama BACKLINK?
(Anda tidak perlu dijelaskan sulitnya menentukan peringkat halaman tempat pertama untuk istilah kata kunci yang Anda targetkan di Google, bukan?)
Klik tombol biru di bawah ini dan gunakan alat Semrush SEO untuk meningkatkan lalu lintas blog Anda.
Gaya Plugin Komentar Facebook mana yang Anda gunakan?
Ya, saya ingin melihat bagaimana plugin komentar Pitiya Facebook terlihat di blog Anda. Inilah cara membagikan pekerjaan Anda.
- Gulir ke bawah halaman ini sampai Anda menemukan formulir komentar.
- Masukkan nama Anda (nama Anda, bukan nama blog) dan URL blog Anda di mana pembaca Pitiya dan saya dapat melihat karya Anda.
- Ketik komentar tentang pengalaman Anda menggunakan plugin komentar Facebook sejauh ini. (setiap komentar harus deskriptif dan langsung ke intinya.)
- Posting komentar.
- Pemenang yang beruntung yang blognya menarik dan memiliki konten berkualitas tinggi akan memenangkan hadiah spesial dari saya!
Comments