Total Pageviews

Google Translate
Arabic Korean Japanese Chinese Simplified Russian Portuguese
English French German Spain Italian Dutch

Blog Archive

12 April 2011

menambahkan komentar facebook di blog tanpa banner

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 Lalu Klik Pada Menu Klik 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 LaluSilahkan Kunjungi, pengembang facebook disini : Facebook developers

Anda akan diwa 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 "

kemudian klik pada tab Connect ( Terhubung ) (pada daftar-tab kiri) Anda akan dibawa kehalaman Terhubung seperti gambar dibawah ini :





Ingat Sewaktu Memasukkan ULR Terhubung Jangan Lupa beri tanda / pada akhir ULR Blog sobat, sebagai Contoh pada gambar diatas saya masukkan ULR Terhubung : http://trafikmagic.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,


Arahkan ke
+ Lalu Centang

Jangan Lupa Download Template Anda untuk menjaga jika terjadi kesalahan.

Untuk Mempermudah dalam pencarian kode Tekan Ctrl + F

Cari

< body >

Tambahkan Kode berikut dibawahnya

<div id='fb-root'/>

<script>

window.fbAsyncInit = function() {

FB.init({

appId : &#39;APP-ID Anda&#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

</head>
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
APP-ID Anda : Ganti dengan APP ID anda
Profile-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 /> <p align='left'><a href="http://www.kumpulancara.com/2010/06/cara-pasang-kotak-komentar-facebook-di.html" target="new"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhVeolnBMh7Nm9G4MMY-VIyMb6RwkEQgN0ThYd0NzCcU9ye6vKq8My2-QG_KGA_lc_P2j9mKZ-K062TuF-gpfNI6dgVJfIEmzNka9f7E3kPH3UEIgWnPT_KuKpb3ilKzNssjfbDEVAJyy0/s1600/comment.gif" /></a></p><div><fb:comments width='450' 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://www.kumpulancara.com/2010/06/cara-pasang-kotak-komentar-facebook-di.html' target='_blank' title='Facebook Comment'>Facebook Comment , Mau ?</a></b></div></b:if><br />

Untuk Merubah Lebar Silahkan Ganti Angka 450 sesuai Template Masing2

--------------------------------------------------------------------------------------------

nah artikel diatas adalah artikel yang saya copas dari blog yang nangkring diposisi teratas mbah google dengan keyword (menambahkan komentar facebook di blog) mungkin agan agan sekalian bingung ketika agan telah menjalankan semua tutorial diatas ternyata terdapat gambar yang apabila diklik akan menuju blog siempunya artikel tersebut....

kira2 gambarnya seperti ini.


karena saya pun demikian, setelah mencari seluruh tutorial "menambahkan komentar facebook di blog" ternyata hampir semua terisikan gambar tersebut yang apabila di klik akan menuju ke blog dimana tutorial ini kalian dapatkan. (hmmmm mungkin maksudnya promosi kali yha)...

tentu saja demikian karena didalam kode html yang agan copy tidak hanya terdapat komentar facebook tetapi juga gambar yang berisikan link menuju website tersebut. yha memang komentar facebooknya akan tetap muncul, namun apakah agan2 sekalian mau menampilkan gambar berisikan link blog orang laiin setiap komentar agan muncul tanpa agan ketahui,, tentunya tidak mau kan.

mungkin kalian bertanya2 bagaimana cara menghilangkannya.
nah... untuk para blogsphere yang masih nubi mungkin kebingungan bagaimana cara menghilangkan gambar tersebut , termasuk saya. namun setelah saya utak utik ternyata.

kode yang ditaruh diatas kode yang kedua terdapat link


<b:if cond='data:blog.pageType == "item"'><br /> <p align='left'><a href="http://www.kumpulancara.com/2010/06/cara-pasang-kotak-komentar-facebook-di.html" target="new"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhVeolnBMh7Nm9G4MMY-VIyMb6RwkEQgN0ThYd0NzCcU9ye6vKq8My2-QG_KGA_lc_P2j9mKZ-K062TuF-gpfNI6dgVJfIEmzNka9f7E3kPH3UEIgWnPT_KuKpb3ilKzNssjfbDEVAJyy0/s1600/comment.gif" /></a></p><div><fb:comments width='450' 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://www.kumpulancara.com/2010/06/cara-pasang-kotak-komentar-facebook-di.html' target='_blank' title='Facebook Comment'>Facebook Comment , Mau ?</a></b></div></b:if><br />


nah kodenya seharusnya adalah ini namun jika anda menaruh kode ini dibawah kode <data:post.body/> maka banner si empunya blog akan muncul,,, maka kode diatas sebaiknya diganti dengan kode

<b:if cond='data:blog.pageType == "item"'><br /> <p align='left'></p><div><fb:comments width='450' 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></b></div></b:if><br />

nah terlihat kan perbedaannya. kode html yang bermuatan link sudah tiada.. nah baru masukan kode diatas setelah kode <data:post.body/> yang kedua
.. dan bannernya pun akan hilang

By berli


0 comments:

Post a Comment

Related Posts Plugin for WordPress, Blogger...
Bagi teman-teman yang ingin memasang link webnya di blog ini silahkan isi form berikut

 
Design by Free WordPress Themes | Bloggerized by Lasantha - Premium Blogger Themes | Grants For Single Moms