Cara Menggabungkan Tab Komentar Facebook Pada Blogger

Assalamu'alaikum.. Jumpa lagi sahabat Hijaben, kali ini admin mau sharing mengenai kode html lebih tepatnya Memasangkan Tab Komentar Facebook atau menggabungkannya dengan tab komentar bawaan Blogger

Jadi untuk para pengunjung atau pembaca bisa memilih berkomentar melalui kolom facebook atau kolom blogger sesuai selera pengunjung 

Contohnya seperti ini:

Anda tertarik?  Oke lansung saja kita buat.. 

Sebelumnya kalian harus menyediakan ID Halaman Facebook, bagi yang belum punya halaman facebook (Fanspage Facebook) Silahkan di buat dulu

Untuk cara mengetahui ID Halaman Facebook kalian bisa baca disini Cara Mengetahui ID Halaman  

Jika sudah dipersiapkan langsung kita buatkan kodenya 

1. Masuk login ke blogger.com

2. Pilih Template dan Pilih Edit HTML

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

4. Copy kode ini:

Editor@HC ~

• File

<div class='comments-tab' id='fb-comments' onclick='javascript:commentToggle("#fb-comments");' title='Comments made with Facebook'> <img class='comments-tab-icon' src='http://icons.iconarchive.com/icons/uiconstock/socialmedia/48/Facebook-icon.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='ID Halaman Facebook' 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>

Dan letakan / paste tepat di bawah kode <div class='comments' id='comments'>

Silahkan ganti <meta content='ID Halaman Facebook' dengan ID kalian

5. Terakhir di save..! 

Selamat kalian baru saja menambahkan Tab komentar facebook pada blog kalian, silahkan di cek hasilnya dengan refresh halaman blog kalian

Untuk icon Tab komentar facebook bisa di ganti / sesuaikan dengan selera kalian

"Cara di atas telah di uji coba pada blogger.com dan untuk blog lainnya mungkin sama kodenya tinggal menyesuaikan"

Baiklah demikian postingan kali ini, jika bermanfaat luangkan waktu untuk share like dan subscribe, dan silahkan berkomentar jika ada pertanyaan seputar judul postingan ini

Sampi ketemu di postingan selanjutnya, Wassalam.. 

Share Share Tweet Share Share Share

KLIK

DONASI VIA PAYPAL Bantu berikan donasi jika artikelnya dirasa bermanfaat. Donasi Anda membantu Admin untuk lebih giat lagi dalam membagikan template blog yang berkualitas. Terima kasih.