Cara Membuat komentar Facebook Berdampingan dengan Blogger

Mungkin udah banyak yang tahu dan buat tutorial cara membuat kotak komentar facebook berdampingan dengan kotak komentar blogger. Tapi belom semua tau cara paling mudah dan gak berbelit-belit seperti yang akan saya utarakan dibawah ini. Atau mungkin ada yang belum tahu apa itu komentar facebook dan blogger berdampingan, bagi yang belum tahu, Jadi gini kotak komentar yang biasa kita lihat dibawah postingan blog akan kita letakkan persis disebelah/disamping kotak komentar bawaan blogger.

Nah udah tahu kan? gimana, keren bukan? Caranya gampang kok, ikuti aja langkah-langkah membuat kotak komentar facebook berdampingan dengan kotak komentar blogger dibawah ini :

1. Login dulu ke akun Blogger Anda.

2. Pilih Rancangan lalu Edit HTML

3. Cari kode <div class='comments' id='comments'>

4. Kemudian copas kode dibawah ini, letakkan tepat dibawah kode <div class='comments' id='comments'> tadi.

Jika kode <div class='comments' id='comments'> ada 2, pastekan kode dibawah ini tepat dibawah kode <div class='comments' id='comments'> yang ke-2.

<div class='comments-tab' id='fb-comments' onclick='javascript:commentToggle(&quot;#fb-comments&quot;);' 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(&quot;#blogger-comments&quot;);' 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 == &quot;item&quot;'><div id='fb-root'/> <fb:comments expr:href='data:post.url' num_posts='2' width='610'/></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 Anda' property='fb:admins'/><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><style>.comments-page { background-color: transparent;}#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>
5. Ganti width sesuai dengan ukuran main-wrapper template blog anda
6. Ganti ID Facebook Anda
7. Caranya buka halaman profile anda dan copy seperti yang bertanda merah ini https://www.facebook.com/user Anda
8. Kemudian ketikan di addreess bar http://graph.facebook.com/user yang tadi dicopy
9. Ganti ID Facebook Anda dengan angka yang tertera pada graph facebook anda
10. Setelah diganti Simpan Template anda dan lihat hasilnya.

Bagikan ke

Facebook Google+ Twitter

Search