Ada 2 macam komentar Facebook yang dapat dipasang di Blog Blogger, yaitu komentar Facebook untuk template biasa dan komentar Facebook responsive untuk template responsive.
Sebelum melakukan tutorial dibawah ini sebaiknya backup dulu template anda ( simpan semua kode template di notepad ) agar 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
4. kemudian letakkan kode di bawah ini tepat dibawah kode
<div class='comments-tab' id='fb-comments' onclick='javascript:commentToggle("#fb-comments");' title='Comments made with Facebook'>5. Silahkan cari dan ubah kata "ID FACEBOOK KAMU" dengan id facebook kamu. Dan lihat hasilnya.
<img class='comments-tab-icon' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg0JPpuJIRkE7lQpSV9gG0-DB78O1aQHU37ZKdtDhSh_bqGYfSyREwLgF7um1Lk9Ir1TuK43Vt65C4_517hvJIrk4vddr9-erLjqPaKYuoS-alc0-iaTwXwjAJWdVA8FeIzjpAiwrYkvIc/s1600/H3nktOa7ZMg.jpg'/>
<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>
Cara memasang Facebook komentar Responsive
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.Ok langsung saja berikut langkah-langkahnya;
1. Dashboard >> Template >>Edit HTML
2. Cari (CRTL+F) kode
3. Copy kode berikut ini dan simpan (paste) di bawah kode
<div id='fb-root'/>4. Copy kode berikut ini dan simpan (Paste) tepat di bawah kode
<script src='http://connect.facebook.net/en_US/all.js#xfbml=1'/>
<b:if cond='data:blog.pageType == "item"'>NOte:
<div style='margin-top:20px'>
<div class='fb-comments' data-num-posts='5' data-width='100%' expr:data-href='data:blog.url'/>
</div>
</b:if>
Angka 100% adalah lebar kotak komentar Facebook. Sesuaikan dengan lebar text area blog Anda.
5. Save Template dan selesai.
Cara memasang komentar facebook di template blog ada bermacam-macam kodenya, tinggal sesuaikan saja dengan template blog yang anda gunakan. Semoga tutorial bermanfaat & Happy Blogging!
0 Response to "Cara Memasang komentar Facebook Responsive"
Post a Comment