Setelah Sebelumnya saya mengajak anda membuat Tombol like Facebook pada postingan serta Twitter Box Di bawah postingan anda, Kali ini saya akan mengajak anda membuat Kotak Komentar Facebook di Blogger Anda. Bentuknya seperti Gambar Diatas, Tertarik Membuatnya?
Silahkan Simak Tutorial Berikut:
Langkah 1.
- Pertama login ke akun blogger anda.
- Kemudian buka facebook anda, login terlebih dahulu, lalu masuk ke aplikasi facebook developers
- Kemudian buat nama aplikasi terlebih dahulu, Isikan nama Aplikasi Dengan Kotak Komentar atau lainnya setelah itu, klik tombol " Buat Aplikasi baru (create new aplication)"
Jika sudah, Save dan ambil Applications ID'nya (Kode Aplikasinya) Jika Sudah, masuk Ke Akun Blogger Anda Masing-masing > rancangan(Design) > Edit HTML > Centang Expand Template Widget
Jika Sudah, Cari Kode Berikut: <body>
Setelah Ketemu, Masukkan Kode Dibawah ini tepat Dibawah Kode Tersebut
<div id='fb-root'/>
<script>
window.fbAsyncInit = function() {FB.init({
appId : ' APP-ID anda ',
status : true, // check login status
cookie : true, // enable cookies to allow the server to access the session
xfbml : true // parse XFBML});};
(function() {var e = document.createElement('script');
e.src = document.location.protocol + '//connect.facebook.net/en_US/all.js';e.async = true;document.getElementById('fb-root').appendChild(e);}());
</script>
Kemudian, Cari Kode <b:skin><![CDATA[/* dan Copy Kode Dibawah ini Dan taruh tepat diatasnya:
<b:if cond='data:blog.pageType == "item"'>
<meta expr:content='data:blog.pageTitle' property='og:title'/>
<meta expr:content='data:blog.url' property='og:url'/>
<b:else/>
<meta expr:content='data:blog.title' property='og:title'/>
<meta expr:content='data:blog.homepageUrl' property='og:url'/>
</b:if>
<meta content='URL blogger andaproperty='og:site_name'/>
<meta content='http://google.com/help/hc/images/logos/blogger_logo.gif' property='og:image'/>
<meta content='APP-ID anda' property='fb:app_id'/>
<meta content='Profile-ID-Facebook anda' property='fb:admins'/>
<meta content='article' property='og:type'/>
Jika sudah, cari Kode <data:post.body/> dan copy script dibawah ini tepat dibawah kode tersebut:
<b:if cond='data:blog.pageType == "item"'><br/>
<p align='left'><a href='url-blogger-anda' target='new'>
<img border='0'/></a></p><div><fb:comments expr:title='data:post.title' expr:url='data:post.url' expr:xid='data:post.id' width='450'/></div>
<div style='background-color: #f2f2f2;border: solid 1px #cccccc; font-size:10px; padding:3px;width:100%;'>
</div></b:if><br/>
Kemudian save Template Anda dan lihat hasilnya
0 Berkomentarlah dengan sopan, jangan spam:
Posting Komentar