ILER: Memasang kotak komentar facebook di blog terbaru 2012

Modar-mandir, kesana kemari ketika saya mencari tutorial blog bagaimana cara pasang facebook komentar dibawah postingan susahnya lumayan, bukannya gak ada, yang ada juga gak ada cocok, di coba satu persatu, banyak gagalnya tapi ada juga yang berhasil cuman hasilnya tidak memuaskan dan kurang sempurna. tapi pada akhirnya saya menemukan sendiri caranya dan terbukti sukses, berhasil sempurna sesuai yang diinginkan.

berikut ini solusi terbaik dan cara yang saya praktekan berhasil memuaskan, ok langsung ke TKP..

1. Pertama anda masuk ke facebook developers langsung aja KLIK DISINI.
*pastikan anda sudah login ke facebook, tapi sebetulnya bagi anda yang tidak mempunyai akun facebook atau tidak login ke facebook pun bisa mendapatkan kode nya dan disini anda tidak perlu mendaftar aplikasi facebook seperti biasanya.

- Isilah kolom URL to commnet on dengan blog/website anda.
- Pada kolom Number of posts ganti angka sesuai keinginan anda, angka tersebut merupan jumlah komentar yang muncul di blog, apabila komentar lebih dari nominal yang di pilih maka komentar otomatis tersembunyi di bawah komentar ke terakhil, jika ingin menampilkannya anda tinggal mengklik tombol "tampilkan yang lain".
- Di kolom Width gantilah sesuai dengan lebar template template blog ada.
- Color scheme ada dua pilihan: light an dark, pilih sesuai selera.
- Terakhir tekan tombol Get Code.
maka munculah jendela seperti ini

2. Pada tab HTML 5 yang kita gunakan hanya kode yang paling bawah, sedangkan kode yang diatasnya itu diabaika sajah, kopi terlebih dahulu kode di bawah tersebut dan pastekan dahulu ke notepad.

3. selanjutnya Log in ke Blogger pilih Template lalu pilih Edit HTML lalu Pilih Lanjutkan kemudian centang Expand Template Widget (posisi di pojok kiri atas).

*ingat! backup terlebih dahulu template sebelum melanjutkan tutorial ini

4. Cari tag

<body>

5. Kemudian Kopi lalu pastekan kode di bawah ini setelah kode <body>

<div id='fb-root'/>
<script>(function(d, s, id) {
var js, fjs = d.getElementsByTagName(s)[0];
if (d.getElementById(id)) {return;}
js = d.createElement(s); js.id = id;
js.src = "//connect.facebook.net/en_GB/all.js#xfbml=1";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>

maka hasilnya akan seperti ini

<body>
<div id='fb-root'/>
<script>(function(d, s, id) {
var js, fjs = d.getElementsByTagName(s)[0];
if (d.getElementById(id)) {return;}
js = d.createElement(s); js.id = id;
js.src = "//connect.facebook.net/en_GB/all.js#xfbml=1";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>

6. Tahap pertama selesai lanjut ke tahap berikutnya, masih ingat langkah ke 2 yap buka notepad yang berisi kode tadi kemudian kopi lalu letakan kode tadi setelah kode

<p class='comment-footer'>
<b:if cond='data:post.embedCommentForm'>
<b:if cond='data:post.allowNewComments'>
<b:include data='post' name='comment-form'/>
<b:else/>
<data:post.noNewCommentsText/>
</b:if>
<b:else/>
<b:if cond='data:post.allowComments'>
<a expr:href='data:post.addCommentUrl' expr:onclick='data:post.addCommentOnclick'><data:postCommentMsg/></a>
</b:if>
</b:if>
</p>
</b:if>

atau yang mirip dengan kode diatas karena posisi komentar facebook nya berada dibawah komentar bawaan blogspot, atau anda bisa menonaktifkan komentar bawaannya dengan pilih Setelan-Pos dan komentar-lokasi komentar, lau pilih Sembunyikan.
Maka hasilnya akan seperti ini

<p class='comment-footer'>
<b:if cond='data:post.embedCommentForm'>
<b:if cond='data:post.allowNewComments'>
<b:include data='post' name='comment-form'/>
<b:else/>
<data:post.noNewCommentsText/>
</b:if>
<b:else/>
<b:if cond='data:post.allowComments'>
<a expr:href='data:post.addCommentUrl' expr:onclick='data:post.addCommentOnclick'><data:postCommentMsg/></a>
</b:if>
</b:if>
</p>
</b:if>
<div class="fb-comments" data-href="http://bloganda.blogspot.com" data-num-posts="5" data-width="470"></div>

*Yang diwarnai merah adalah kode yang di dapat dari langkah 1 dan 2
*Yang diwarnai hijau bisa anda sesuaikan lagi jika merasa perlu dirubah kembali.

7. Selasai simpan template dan lihat hasilnya.

ILER

Kamis, 19 April 2012

Memasang kotak komentar facebook di blog terbaru 2012

Tidak ada komentar:

Posting Komentar