Cara Memasang Komentar Facebook di Blog

Posted by Night Raid Script Posted on 23.59

Night Raid Cara Memasang Komentar Facebook di Blog -   memasang komentar facebook responsive di Blogger . Sebagian besar pengguna internet selalu terhubung dengan akun facebooknya jadi agar para pengunjung blog lebih mudah berkomentar menggunakan akun Facebook nya. Komentar Facebook di Blogger adalah untuk  menghubungkan konektivitas antara social media tersebut dengan blog kita. Sehingga, blog kita mendapatkan lalu lintas yang besar dengan Facebook.

Anda pasti telah berkunjung ke blog - blog atau website yang memasang komentar facebook ini cara membuat kotak komentar Facebook ini cukup mudah dan agar blog Anda lebih terkonektivitas dengan Facebook.

Kesempatan ini Night Raid akan membagikan 2 macam Komentar Facebook untuk template responsive. Berbicara soal template responsive maka anda dapat melihat koleksi template seo responsive ini di :

Sebelum melakukan tutorial dibawah ini sebaiknya backup dulu template anda (misalnya simpat semua kode template di notepad) agar nantinya jika terjadi kesalahan atau tidak sesuai dengan keinginan maka mudah untuk dikembalikan seperti semula

Cara memasang Facebook komentar di Template Blog biasa

1. Masuk ke akun blogger.

2. Pilih menu template --> Edit HTML

3. Cari kode (CTRL+F) ini <div class='comments' id='comments'>

4.Kemudian letakkan kode di bawah ini tepat dibawah kode <div class='comments' id='comments'>

---

<div class='comments-tab' id='fb-comments' onclick='javascript:commentToggle("#fb-comments");' title='Comments made with Facebook'>
<img class='comments-tab-icon' src='http://static.ak.fbcdn.net/rsrc.php/v1/yH/r/eIpbnVKI9lR.png'/>
<fb:comments-count expr:href='data:post.url'/> Comments
</div>
<div class='comments-tab inactive-select-tab' id='blogger-comments' onclick='javascript:commentToggle("#blogger-comments");' title='Comments from Blogger'>
<img class='comments-tab-icon' src='http://www.blogger.com/img/icon_logo32.gif'/> <data:post.numComments/> Comments
</div>
<div class='clear'/>
</div>
<div class='comments-page' id='fb-comments-page'>
<b:if cond='data:blog.pageType == "item"'>
<div id='fb-root'/>
<fb:comments expr:href='data:post.url' num_posts='2' width='400'/>
</b:if>
</div>
<div class='comments comments-page' id='blogger-comments-page'>
<script src='http://connect.facebook.net/en_US/all.js#xfbml=1'/>
<script src='http://code.jquery.com/jquery-latest.js'/>
<meta content='ID FACEBOOK KAMU' property='fb:admins'/>
<script type='text/javascript'>
function commentToggle(selectTab) {
$(".comments-tab").addClass("inactive-select-tab");
$(selectTab).removeClass("inactive-select-tab");
$(".comments-page").hide();
$(selectTab + "-page").show();
}
</script>
<style>.comments-page { background-color: #f2f2f2;}
#blogger-comments-page { padding: 0px 5px; display: none;}
.comments-tab { float: left; padding: 5px; margin-right: 3px; cursor: pointer; background-color: #f2f2f2;}
.comments-tab-icon { height: 14px; width: auto; margin-right: 3px;}
.comments-tab:hover { background-color: #eeeeee;}
.inactive-select-tab { background-color: #d1d1d1;}</style>

Silahkan cari dan ubah kata "ID FACEBOOK KAMU" dengan id facebook kamu. Dan lihat hasilnya.

Cara Memasang Facebook Komentar Responsif

Untuk anda yang sudah memasang kotak komentar facebook, tutorial ini cocok kamu terapkan di blog kamu yang sudah mendukung fitur responsive. Komentar facebook responsive berikut ini adalah kotak komentar Facebook yang dibuat responsive. Hal ini di lakukan untuk mendukung bagi yang menggunakan template responsive.

Yang perlu kamu lakukan adalah menambah kode Javascript ini :

---

<script type="text/javascript">
//<![CDATA[
$(window).bind("load resize", function(){
  var url = location.protocol+'//'+location.host+location.pathname;
  var containercm_width = $('#container-commentfb').width(); 
    $('#container-commentfb').html('<div class="fb-comments" ' +
    'data-href="'+url+'"' +
    ' width="' + containercm_width + '" data-num-posts="10"></div>');
    FB.XFBML.parse( ); 
});
//]]>
</script>

Copy dan Paste kode tadi di atas kode </head>
Langkah berikutnya adalah memasang kode html. Letakkan kode berikut ini di bawah kode untuk
related post atau jika sobat bingung silahkan cari kode <div class='comments'id='comments>,
jika ada lebih dari 1 kode silahkan coba satu persatu. Kode Fb Komennya seperti ini :

---

<b:if cond="data:blog.pageType == &quot;item&quot;">
<h4>Post Comment</h4>
<div id='fb-root'/>
<script src='http://connect.facebook.net/en_US/all.js#xfbml=1'/>
<div id='container-commentfb' style='width: 100%'><fb:comments expr:href='data:post.url' num_posts='5' width='500'/></div>
</b:if>

Jika bingung, hapus semua kode Facebook komen yang ada di blog kamu, lalu ganti dengan kode yang sudah Night Raid berikan diatas.

Cara memasang komentar blog bag.3

Ok langsung saja berikut langkah-langkahnya;

1. Dashboard>>Template>>Edit Html

2. Cari (CRTL+F)kode <body>

3. Copy kode berikut ini dan simpan (paste) di bawah kode <body>

---

<div id='fb-root'/>
<script src='http://connect.facebook.net/en_US/all.js#xfbml=1'/>

4. Copy kode berikut ini dan simpan (Paste) tepat di bawah kode <div class='comments'id='comments'>.Jika ada lebih dari 1 kode di template blog Anda, simpan
di bawah kode yang kedua atau dicoba satu persatu

---

<b:if cond='data:blog.pageType == &quot;item&quot;'>
<div style='margin-top:20px'>
<div class='fb-comments' data-num-posts='5' data-width='600' expr:data-href='data:blog.url'/>
</div>
</b:if>

Note:
Angka 600 adalah lebar kotak komentar Facebook. Sesuaikan dengan lebar text area blog Anda.
5. Save Template dan selesai

Bagaimana sobat, mudah bukan ?, memang cara memasang komentar Facebook di template
blog ada bermacam-macam kodenya, tinggal sesuaikan saja dengan template blog yang anda gunakan. Semoga tutorial cara memasang komentar Facebook dan komentar Facebook
responsive ini mudah di pahami, dan selamat mencoba