Cara Mudah dan Lengkap memasang Kolom Komentar Facebook pada Blog

Tempo hari dapat masukan dari seorang teman penikmat blog saya. Komentar, ya dia berkomentar mengenai kesulitan dia dalam berkomentar atau komentar diblog saya menggunakan akun facebook.
jika harus menggunakan g+ atau yang lain, ya sulit.. begitu komentarnya.

Saya ga ngerti sama sekali mengenai hal ini. selancar didumay guna mendapatkan tutorial mudah dan lengkap mengenai cara memasang kolom komentar facebook pada blog, namun sudah berkali - kali mencoba, tapi belum berhasil.

tanpa banyak waktu, saya menghubungi teman saya yang sudah ahli dalam bidang ini, Mas Agung. (klik aja nanti akan masuk ke blog dia, sekalian promosi blog dia). Saya banyak belajar tentang tutorial blog dengan dia.

Wal hasil saya diberi alamat url ke suatu blog yakni bos tutorial dan kemudian saya praktekkan sendiri sebagai script kiddy. Emang, pengetahuan saya dalam dunia script blog, sangat sangat masih awam.

Langsung saja, mudahan ini bisa work juga diblog teman - teman yang lain dikutip dari bos tutorial namun saya tulis ulang dengan gaya saya sebagai seorang script kiddy, mudah dan lengkap.

Baca: Membuat Kotak Script pada Blog
Baca : Cara menulis tanda derajat pada blog

Pertama :

Buka dasbor blog dan "tema", kemudian "Edit html". Tampilan seperti dibawah ini.

Kedua:

Klik Control + F (Ctrl+F). berfungsi memunculkan fungsi search. Hal ini berguna untuk memudahkan pencarian dengan kata kunci.

Ketiga:

Tulis "comments" pada kolom search.

Keempat.

Apa sich yang kita cari? Kata tutorial sich nyari ini "<div class='comments' id='comments'>".

Temukan hingga seperti dalam kolom merah ya. Okay


Kelima:

Tekan Enter setelah "<div class='comments' id='comments'>".

Nah udah ada spasi kan. Berguna utk apa? Copy Paste kode. Kodenya berikut ini.

<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='550'/></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='IDFANPAGEFACEBOOK' 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>

Keenam:

Sebelum copas kedalam edit template, alangkah lebih baik (disarankan) copy paste dulu kedalam notepad.

nah macam itu, baru kemudian, copy paste lagi kedalam template.

Dan setelah itu, klik save template.

Langkah terakhir adalah lihat blog dan check pada postingan anda, apakah kolom komentar via fb sudah muncul.

semoga bermanfaat.

Jangan lupa tinggalkan pesan pada kolom komentar.

Baca : Check data mahasiswa via Dikti
Baca : Cerita Lucu Abu Nawas dan Sandal Ajaib