Cara Membuat Komentar Blogger dan Facebook Berdampingan

Tutorial kali ini menjelaskan cara Membuat Komentar Blogger dan Facebook Berdampingan.. Cara ini berhasil disemua template pada Blogger karena saya sudah mencobanya.. Langsung Saja ya.....


Langkah-langkahnya..

1. Login ke blogger anda..
2. Click Template/Rancangan -> Edit HTML (Untuk Berhati-hati, Back Up dahulu template anda dengan cara copas semua code HTML Template tersebut kedalam notepad..)
3. Cari Code ]]></b:skin> ; biar lebih cepat Tekan Ctrl+F
4. Letakkan Script dibawah ini tepat diatas kode ]]></b:skin>

comments-page { background-color: #ffffff;} #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;}

NB -> Hilangkan Code yang berwarna Biru bila ingin warna background nya transparan..

7. Cari code </head>
8. Masukkan Script dibawah ini tepat diatas Code </head>

<script src='http://connect.facebook.net/en_US/all.js#xfbml=1'/> <script src='http://code.jquery.com/jquery-latest.js'/> <meta content='ID Application FB Anda' 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>

NB -> Ganti Code warna Merah dengan ID Application FB anda.. Bila belum mempunya ID Application FB Click Here..

9. Setelah itu Cari Code <div class='comments' id='comments'>

NB -> Di template blog mempunyai 2 code <div class='comments' id='comments'> 

10. Copy Script dibawah ini tepat dibawah kedua code <div class='comments' id='comments'>

<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='https://www.facebook.com/images/fb_icon_325x325.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='400'/> </b:if> </div> <div class='comments comments-page' id='blogger-comments-page'>

Ganti code warna hijau bila ingin merubah jumlah Komentar.. Ganti code warna kuning bila ingin merubah lebar kontak komentarnya..

11. Save Templatenya, dan lihatlah langsung kontak komentar pada blog anda..

12. Bila Bagian yang kesepuluh tidak bisa, coba hapus script yang tadi diletakkan di bagian pertama code <div class='comments' id='comments'> ..

13. Bila masih tidak bisa, Comment..

14. The End..

>>>>> SEMOGA BERMANFAAT <<<<<