Aries Club17 Official Website | Blogger Members area : Register | Sign in

Tahukah Kamu

Cara Pasang Kotak Komentar Facebook di Blogger | HOT

Selasa, 10 Agustus 2010

Share to :
+1
Akhirnya artikel yang sangat ditunggu-tunggu Di Publish juga, ini adalah fitur yang paling ditunggu untuk pengguna blogger, dalam langkah-langkah sangat mudah untuk meng-integrasi kotak komentar facebook dan blogger ( blogspot) blog.

Sekarang pengunjung tidak perlu ketik alamat email mereka atau nama untuk memberikan komentar di situs anda. Mereka hanya login ke account facebook mereka secara otomatis sudah bisa komentar .
Semua orang terhubung melalui facebook , Hal ini akan mendorong lebih banyak orang untuk komentar karena kebanyakan orang sudah log in ke account mereka.

Oke mari kita melakukannya, jangan khawatir, saya tahu bahwa Anda ingin mencoba menambahkannya ke blog blogger namun tanpa hasil, tetapi sekarang Anda akan melihat bagaimana cara menambahkannya dengan langkah sangat mudah dan bekerja 100%. tetapi harap berhati-hati dan memperhatikan semua rincian.
Kini Pengunjung yang Punya Account Facebook bisa Berkomentar di Blog Anda

Langkah 1. Nonaktifkan Default Komentar

Hal pertama yang harus Anda lakukan yakni Nonaktifkan Setting Komentar Anda . karena Anda tidak ingin memiliki 2 bentuk komentar, dan jika memang membutuhkan dua komentar biarkan saja seperti biasa.

Silahkan ke account blogger Anda
navigasikan ke Pengaturan (setting) Lalu Klik Komentar (comment) Pada Menu Komentar Klik Sembunyikan kemudian gulir ke bawah dan klik SIMPAN.



Langkah 2. Buatlah Facebook App ID ( Aplikasi di Facebook ).

Sekarang Anda harus menghasilkan facebook app id Anda sendiri, itu benar-benar mudah dan prosesnya hanya satu langkah, Login dulu dengan Account Facebook Anda Lalu Silahkan Kunjungi, pengembang facebook disini : Facebook developers lalu klik Buat Aplikasi Baru.

Maka Anda akan dibawa ke halaman seperti Contoh pada Gambar dibawah :


Masukkan nama aplikasi Anda, (Anda dapat mengetikkan nama apa saja) dan Klik Setuju lalu klik Buat Aplikasi. Sebagai contoh saya membuat aplikasi dengan nama " Kotak Komentar "

Maka anda akan dibawa ke Halaman berikut seperti Gambar di bawah ini:


kemudian klik pada tab Connect ( Terhubung ) (lihat gambar diatas) Anda akan dibawa kehalaman Terhubung seperti gambar dibawah ini :


Ingat Sewaktu Memasukkan URL Terhubung Jangan Lupa beri tanda " / " pada akhir ULR Blog sobat, sebagai Contoh pada gambar diatas saya masukkan ULR Terhubung : http://ariesclub17.blogspot.com/

Masukkan Base Domain : blogspot.com. Lalu Klik Simpan Perubahan

Selanjutnya Silahkan Klik Dasar Untuk Mengambil No Application ID , Copy dulu Application ID di NotePad atau Word agar mudah kita ambil saat kita gunkan nanti pada Langkah Berikutnya.


Langkah 3. Menambahkan Kode pada template blogger

Anda harus menambahkan kode berikut ke template blogger Anda untuk memastikan bahwa kotak komentar akan bekerja untuk blog Anda dengan cara yang benar. silahkan pergi ke account blogger Anda lagi,
Lalu masuk ke Pengaturan >> Rancangan >> Edit HTML lalu centang Expand Template Widget

Jangan Lupa Download Template Anda untuk menjaga jika terjadi kesalahan.

cari code >> < body >
Lalu tambahkan Code berikut ini dibawah code < body >

<div id='fb-root'/>
<script>
window.fbAsyncInit = function() {
FB.init({
appId : &#39;APP-ID&#39;,
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(&#39;script&#39;);
e.src = document.location.protocol + &#39;//connect.facebook.net/en_US/all.js&#39;;
e.async = true;
document.getElementById(&#39;fb-root&#39;).appendChild(e);
}());
</script>

Ganti APP-ID dengan APP ID Aplikasi Facebook yang tadi Anda buat.


Sekarang cari code >> </head>
Lalu letakkan Kode Berikut dibawahnnya

<b:if cond='data:blog.pageType == &quot;item&quot;'>
<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='Nama Blog Anda' property='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'/>

Nama Blog Anda : Ganti dengan Nama Blog Anda
http://google.com/help/hc/images/logos/blogger_logo.gif' : Bisa Anda Ganti dengan Gambar anda atau juga bisa di hapus.
APP-ID Anda : Ganti dengan APP ID anda
Profil-ID-Facebook-Anda : Ganti dengan ID Profile Facebook Anda.


Sekarang kita selesai menambahkan kode facebook untuk template Anda, jangan menyentuh apa pun dan melanjutkan ke langkah berikutnya.


Langkah 4. Menambahkan Komentar Box blogger template Anda.

silahkan cari kode berikut >> <data:post.body/>

Letakkan Kode Berikut dibawahnya
Jika Punya dua <data:post.body/> karena sudah pasang Readmore Silahkan Letakkan di bawah <data:post.body/> yang kedua

<b:if cond='data:blog.pageType == "item"'><br /> <div><fb:comments width='600' expr:title='data:post.title' expr:url='data:post.url'   expr:xid='data:post.id'/></div><div style='background-color: #f2f2f2;border: solid 1px #cccccc; font-size:10px; padding:3px;width:100%;'><b> by <a href='http://ariesclub17.blogspot.com/2010/08/cara-pasang-kotak-komentar-facebook-di.html' target='_blank' title='Facebook Comment'>Facebook Comment , Mau ?</a></b></div></b:if><br /> 

Apabila selesai klik Simpan Template
Terima kasih banyak atas kunjungan teman-teman Blogger ke blog saya yang sederhana ini. Selamat membaca dan jangan lupa untuk berkomentar dibawah ini.
Dukung Artikel Blog ini dengan cara klik icon disamping ini >> Dukungan

6 komentar:

Pengembara mengatakan...

Mantap...Salam Kenal

Obat Herbal mengatakan...

kok pada fb aplikasinya tidak ada menu terhubung(connect0 ya?

TuetinaenStudios.COm mengatakan...

Boleh tuch, berbagi untuk para blogger.

nice kawan.

visit and JOIN NOW!
tuentinaenstudios.com

ASEP mengatakan...

wuiih.. mantep tuh.. thanks infonya..
d tunggu kunjugan baliknya ya..
_from: www.cupidcupid.co.cc

wahyu irawan mengatakan...

trik mantap gan,makasih

RSHsmart mengatakan...

nice info gan... thanks....

Posting Komentar

 
+1