Cara Termudah Membuat Kolom Komentar Facebook Pada Blog

Selamat pagi dan selamat berpuasa sobat. Pada postingan kali ini saya akan membahas Cara Termudah Membuat Kolom Komentar Facebook Pada Blog. Mempercantik blog mungkin adalah keinginan para blogger. Membuat Kolom Komentar Facebook dan Blog secara bersamaan merupakan salah satu cara mempercantik tampilan blog. Semuanya bertujuan agar blog tersebut disukai dan disenangi dari segi design dan tata letak. Sehingga, penampilan dari blog tersebut bisa menarik perhatian para pengunjung blog.

Contoh Kolom Komentar Facebook Pada Blog

Gimana ?? Sobat pengen ??
Ok, kalo sobat pengen, lanjut saja kita mulai membuat kolom komentar facebook pada blog

1. Buka blogger sobat atau "klik disini".
2. Pada Dasbor Blog sobat, klik "Template".

3. lalu pilih "Edit HTML".
4. Cari kode <div class='comments' id='comments'> dengan cara CTRL + F ( kalau kode <div class='comments' id='comments'> ada 2 pilih yang dekat dengan kode <a name='comments'/> ).
5. Lalu copy script dibawah ini dengan cara klik "Highlight All" lalu klik kanan dan pilih copy / salin.

<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='MASUKKAN ID FACEBOOK SOBAT' 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>

6. Kemudian pastekan script yang sobat copy tadi tepat di bawah kode <div class='comments' id='comments'>.
7. Tekan CTRL + F lagi, lalu cari tulisan MASUKKAN ID FACEBOOK SOBAT.
8. Kemudian ganti tulisan MASUKKAN ID FACEBOOK SOBAT dengan ID Facebook sobat.

9. Dan yang terakhir klik "Simpan Template" ^_^.