Senin, Mei 20, 2013
Cara Menggabungkan Komentar Facebook dan Komentar Blogger
Bagi yang tertarik ingin mencobanya, silahkan dibaca, dan sangat berharap tutorial ini sedikit berguna,, simple saja jangan buu buru.. langsung saja mari kita Let's do it :
Masuk blogger - Pilih Template - Klik Edit HTML - cari Code Berikut Ini :
- width='400' dapat disesuaikan dengan lebar halaman artikel blog Anda.
- Untuk menambah efek scroll pada kolom komentar Anda bisa mengganti kode:
<div class="comments-page" id="fb-comments-page">
dengan kode: <div class="comments-page" id="fb-comments-page" style="max-height: 230px; overflow: auto;">
Tetapi jika tidak ingin menambah scroll, silahkan di abaikan saja.
Selanjutnya cari kode: </head> lalu letakkan kode dibawah ini tepat diatasnya.
Kemudian cari Code Berikut /* Comment atau kode: #comments, kalau saya sendiri mempunyai banyak code #comments, bagi yang template-nya berbeda biasanya identik dengan comment bisa ID atau class.. okeh apabila sudah ketemu letakan code dibawah ini tepat dibawahnya :
simpan dan pastikan tidak salah..
Masuk blogger - Pilih Template - Klik Edit HTML - cari Code Berikut Ini :
<div class='comments' id='comments'>Apabila terdapat 2, maka pilih saja yang pertama. Kemudian Copy Code dibawah ini dan paste dibawah code diatas :
<div class='comments-tab' id='fb-comments' onclick='javascript:commentToggle("#fb-comments");' title='Comments made with Facebook'>Catatan :
<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'>
- width='400' dapat disesuaikan dengan lebar halaman artikel blog Anda.
- Untuk menambah efek scroll pada kolom komentar Anda bisa mengganti kode:
<div class="comments-page" id="fb-comments-page">
dengan kode: <div class="comments-page" id="fb-comments-page" style="max-height: 230px; overflow: auto;">
Tetapi jika tidak ingin menambah scroll, silahkan di abaikan saja.
Selanjutnya cari kode: </head> lalu letakkan kode dibawah ini tepat diatasnya.
<script src='http://connect.facebook.net/en_US/all.js#xfbml=1'/>Note : Ganti ID FB dengan ID facebook sobat.. contoh ID Fb https://www.facebook.com/ian.azhari.5 yang berwarna merah itu adalah ID sobat..
<script src='http://code.jquery.com/jquery-latest.js'/>
<meta content='ID FB' 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>
Kemudian cari Code Berikut /* Comment atau kode: #comments, kalau saya sendiri mempunyai banyak code #comments, bagi yang template-nya berbeda biasanya identik dengan comment bisa ID atau class.. okeh apabila sudah ketemu letakan code dibawah ini tepat dibawahnya :
.comments-page {}untuk mengantisipasi eror, karena tampilan blog sekarang berlaku untuk Cache jadi selama blog sobat belum ditutup jadi masih bisa di Undo : Ctrl+Z..
#blogger-comments-page {display: none;}
.comments-tab {float:left; padding: 5px; margin-right: 3px; cursor: pointer; background-color: #f2f2f2; border-radius:4px;}
.comments-tab-icon { height: 16px; width: auto; margin-right: 3px;}
.comments-tab:hover { background-color: #eeeeee;}
.inactive-select-tab { background-color: #d1d1d1;}
simpan dan pastikan tidak salah..
Langganan:
Posting Komentar (Atom)
Kunjungan Balik Sob ^^
BalasHapusthank's sob udah berkunjung..
Hapusbagus nih sob,
BalasHapusbermanfaat banget :)
kunjungan baliknya ya
www.mas-edward.blogspot.com
trimakasih sob.....
BalasHapuskunjngi
gudang trik jitu
saya udah bisa gabungin komentar fb dgn blog nya, tapi kok kalu pengunjung komenter via blog kok komentar fbnya gak muncul? mohon pencerahan nya.
BalasHapusBagus Banget Nih Mantaabbb KUnjungi Juga http://fery-antojawa.blogspot.com
BalasHapusapakah komentar di blog juga muncul di fb....
BalasHapusGimana gan, komentar blognya hilang kalo ada orang yang comment menggunakan kolom komentar facebook. ada solusinya nggak?
BalasHapuskunjungan baliknya gan
BalasHapushttps://argopurojatim.blogspot.co.id
Komentar ini telah dihapus oleh pengarang.
BalasHapusmantap gan ilmunya thx
BalasHapus