بِسْمِ اللهِ الرَّحْمنِ الرَّحِيمِ
Membuat Kotak Komentar Facebook Berdampingan Dengan Blogger | Buat Kotak Komentar FaceBook Dan Blogger Berdampingan - Kalau Anda telah baca postingan tentang Interaksi ID Aplikasi Facebook dan berlanjut membaca postingan disini Saya katakan langkah Anda tepat pada jalurnya. Artinya sebelum menerapkan langkah ini rekomendasi dari Saya terapkan terlebih dahulu cara untuk buat Aplikasi Facebook seperti diatas.
Fungsi dari dibuatnya opsi komentar pada weblog tentunya menjadikan blog lebih berfariasi bisa juga dikatakan user friendly sebab, belum tentu pengunjung Anda adalah orang yang punya akun google oleh karena itu pilihan menampilkan kotak komentar di facebook sangat penting ketika ada pengunjung datang dan ingin memberikan komentar baik itu berupa pertanyaan atau lain sebagainya.
Langkah untuk buat kotak komentar fb berdampingan dengan kotak komentar blogger sangat mudah dilakukan namun tetap butuh kejelian untuk menerapkannya. Perhatikan caranya sebagai berikut
- Pertama login ke blogger.com
- Selanjutnya pergi kehalaman pengaturan klik icon entri halaman blog lihat gambar berikut (klik gambar agar lebih jelas)
Step 1 Buat Kotak Komentar FB Blogger Berdampingan
Step 2 Buat Kotak Komentar FB Blogger Berdampingan - Cari kode (Ctrl+F) ]]></b:skin> Lalu letakkan copy paste kode dibawah tepat diatas kode yang Anda cari tadi seperti gambar
.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;}
- Selanjutnya cari kode (Ctrl+F) </head> lalu letakkan kode dibawah, tepat diatas kode tersebut seperti gambar
<script src='http://connect.facebook.net/en_US/all.js#xfbml=1'/>
<script src='http://code.jquery.com/jquery-latest.js'/>
<meta content='suhendri.mr' 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>
- Next cari kode <div class='comments' id='comments'> biasanya kode ini ada 2 ditemplate, letakkan kode berikut tepat di bawah kode ini <div class='comments' id='comments'> yang ke 2 berarti letaknya dibawah halaman bukan diatas ya lihat gambar.
<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='5' width='450'/>
</b:if>
</div>
<div class='comments comments-page' id='blogger-comments-page'>
- Setelah selesai semua sebelum simpan pratinjau lebih dulu, kalau nggak ada error baru simpan template - Selesai
- Lihat no urut 4. ganti ID suhendri.mr dengan ID Facebook Anda
- Num_post = 5 adalah total komentar yang tampil, width=lebar kotak komentar
- Lihat no 5 kalau kotak komentar fb nggak tampil, pasang saja code pada keduanya yang ke1 dan ke2 diantara kode ini <div class='comments' id='comments'>
0 Comments
