Selasa, 22 Juli 2014

Facebook Jadi Komentar

Dan  Kotak Komentar facebook ini berada bawah di setiap postingan blog dan berada di atas komentar blog bawaan blogger. jika sobat tertarik dengan tampilan komentar facebook ini bisa segera mempraktekkan langkah membuat komentar facebook terbaru ini. untuk melihat penampakan facebook komementar sobat bisa lihat gambar  di bawah ini atau lihat langsung gambarnya yang ada di bawah artikel ini. 
Penampakan gambar facebook di bawah postingan blog

Penampakan gambar facebook di bawah postingan blog keren


Sebelum memulai meletakkan kode komentar facebook sobat di haruskan membuat semacam aplikasi facebook untuk mensinkronkan antara blog dan facebook.  saya anggap semua sudah mempunyai akun facebook namun jika ada belum mempunyai akun bisa membuat akun facebook dengan lihat disini

Cara Membuat aplikasi ID Komentar facebook
1. Pertama klik link ini untuk membuat aplikasi facebook jika sudah sampai pilih register as developer

Cara Membuat Kotak Komentar Facebook Di blog
2. Pilih "lanjutkan
Cara Membuat Kotak Komentar Facebook Di bawah postingan blog

 3. Jika muncul seperti gambar seperti ini sobat klik "lewati saja"

Cara memasang Facebook Di bawah postingan blog

4. Namai aplikasi sobat dengan nama sembarang yang penting nama itu "valid"

Cara memasang Facebook Di bawah postingan blog image

5.  Isi chaptha dahulu dan klik lanjutkan.

Cara membuat Facebook Di bawah postingan blog

6. Aplikasi sudah selesai sobat tinggal isi di bagian website with facebook log in dengan  alamat URL blog sobat. kemudian klik "simpan perubahan"
dan untuk melihat nomer ID facebooknya sobat tinggal melihat nomer ID Facebook nya. di bagian paling atas yang nantinya akan di pasangkan di blog sobat.

Cara simple membuat Facebook Di bawah postingan blog

Langkah berikut nya adalah Cara memasang script komentar facebook di bawah postingan blog
berikut langkah-langkah mudah membuat nya

1. Masuk ke Blogger 
2. Pilih Tab TEMPLATE  lalu di sampingnya klik EDIT TEMPLATE
3. Cari kode <head> yang biasanya ada di bagian atas atau jika sobat kesulitan mencari kodenya sobat bisa cari dengan menekan tombol CTRL + F di keyboard lalu masukkan kode <head> lalu tekan ENTER setelah ketemu  sobat letakkan kode di bawah ini di bawah kode <head> 

<meta content='845857439200006' property='fb:app_id'/> 
<meta content='daniesh.alfie' property='fb:admins'/> 

yang berwarna merah sobat ganti dengan nomer ID facebook atau ID profile facebook  yang sobat dapatkan dari cara nomer/gambar nomer 6.

4. Cari kode </head> lalu letakkan kode di warna biru bawah ini di atasnya </head>

<script src='https://connect.facebook.net/en_US/all.js#xfbml=1'/>
<script src='http://code.jquery.com/jquery-latest.js'/>
<script type='text/javascript'>
function commentToggle(selectTab) {
$(&quot;.comments-tab&quot;).addClass(&quot;inactive-select-tab&quot;);
$(selectTab).removeClass(&quot;inactive-select-tab&quot;);
$(&quot;.comments-page&quot;).hide();
$(selectTab + &quot;-page&quot;).show();
}
</script>

5. Yang berikut nya adalah mencari kode <data:post.body/> cara mencarinya sama dengan cara nomer 3. setelah ketemu dengan kode nya sobat tambahkan kode di bawah ini di bawah kode <data:post.body/> (jika kode <data:post.body/> ada 2 atau lebih maka letakkan kode  warna biru ini di bawah kode <data:post.body/> yang paling bawah atau yang terakhir)

<!-- FORM KOMENTAR FACEBOOK -->
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<div id='fb-root'/><script>window.fbAsyncInit = function() {
FB.init({appId  : &#39;845857439200006&#39;,
status : true,
cookie : true,
xfbml  : true});};
(function() {var e = document.createElement(&#39;script&#39;);e.src = document.location.protocol + &#39;//connect.facebook.net/en_US/all.js&#39;;e.async = true;document.getElementById(&#39;fb-root&#39;).appendChild(e);}());</script><fb:comments data-width='600' expr:href='data:post.url' expr:title='data:post.title' migrated='1'/>
</b:if>
<!-- FORM KOMENTAR FACEBOOK -->

Keterangan : 
Ganti kode warna merah dengan ID facebook sobat.

6. yang terakhir "simpan template"

Semoga artikel Cara menambah komentar facebook di bawah artikel blog bisa bermanfaat kepada sobat. selamat mencoba dan semoga sukses. terima kasih

Senin, 21 Juli 2014

Comentar di Facebook

Setelah saya share artikel tentang Cara Membuat Fanspage Facebook Untuk Blog, sekarang saya akan share artikel tentang bagaimana Cara Mudah Membuat / Menambahkan kolom Komentar Facebook Pada Blog untuk sobat blogger.

Lalu bagaimana cara membuat kotak komentar facebook di blog? Sebenarnya facebook sudah menyediakannya, tapi sebagian dari kita atau lebih mungkin belum tau. Saya sendiri sebenarnya tidak tau akan adanya itu, setelah saya googling-googling, akhirnya saya menemukan cara mudah membuat kolom komentar facebook di blog dan tidek ribet dalam pembuatannya.

Cara Membuat Kotak Komentar Facebook
Contoh Kotak Komentar Facebook di Blog



Berikut cara untuk membuat kotak komentar facebook di blog. Cara ini berguna bagi yang sudah membuat fanspage facebook.


Cara Membuat Kotak Komentar Facebook














  • Kemudian akan tampil gambar seperti dibawah ini.

Cara Membuat Kotak Komentar Facebook











  • Kotak yang berwarna merah adalah kotak yang harus diisi oleh sobat untuk membuat kotak komentar facebook.
  • Kotak yang berwarna biru adalah preview kotak komentar yang sobat buat.
Oke, lanjut ke topik pembuatan lagi
  • Pada URL to comment on sobat isi dengan halaman fanspage facebook yang telah sobat buat sebelumnya. Contoh : https://www.facebook.com/pages/Mari-Berbagi/621944211167293. Ini adalah contoh fanspage URL yang saya buat.
  • Jika URL yang sobat masukan benar, maka akan muncul logo/profil picture dan kotak komentar seperti yang saya garis kotak merah.

Cara Membuat Kotak Komentar Facebook











  • Isian Width disesuaikan dengan lebar kolom artikel di blog sobat. Sebagai contoh, lebar kolom artikel saya 800 px, jadi saya isikan ke ke kolom Width 725 px.
  • Isian Number of post terserah sobat blogger. Pada kasus saya ini saya biarkan saja 10.
  • Pada Color Scheme sobat blogger dapat memilih tampilan kotak komentar. (Disesuaikan dengan template sobat masing-masing)
  • Bila dirasa sudah cocok semuanya, sobat blogger klik Get Code, sehingga muncul tampilan seperti ini :

Cara Membuat Kotak Komentar Facebook

  • Langkah selanjutnya yaitu, Copy Script no 1
  • Lalu masuk ke akun Blogger sobat, Pilih Template, Pilih Edit HTML
  • Cari </head> dengan cara Ctrl+F
  • Jika sudah ketemu </head> paste Script no 1 Tepat dibawah kode </head>
  • Kemudian Simpan / Save Template

 Untuk Script no 2
  • Copy script no 2 
  • Pilih Template, Pilih Edit HTML, kemudian centang Expand Widget Templates. (Untuk versi Edit HTML sebelum Pembaharuan). Untuk Versi Edit HTML terbaru sobat blogger bisa Klik Arrow yang ada di sebelah no script (Pada kasus ini tidak usah di Expand)
  • Cari : <div class='post-footer-line post-footer-line-3'><span class='post-location'>
  • Paste / tempel Script no 2 tepat dibawah kode <div class='post-footer-line post-footer-line-3'><span class='post-location'>
  • Save Tempate

Catatan Penting Untuk Sobat Blogger yang Mengalami Error Saat Menyimpan Template Script no 1
Jika ada dari sobat blogger yang mengalami Error saat menyimpan template script no 1, diperkenankan buat mem-Parse coding HTML Script 1 Disini. Setelah itu Copy hasil Parse tersebut, kemudian Paste / Tempel di bawah kode </head> (Ini hanya berlaku bagi sobat blogger yang mengalami Error)