- a. membuat widget fans page facebook
- Silakan login ke akun blog Anda.
- Pada halaman dasbor akun blog, silakan klik nama blog Anda.
- Kemudian pada halaman overview blog Anda, silakan pilih template-edit HTML-Prossed-expand widget template.
- Selanjutnya silakan cari kode ]]></b:skin>.
- Kalau sudah ketemu kodenya, silakan copy dan paste kode di bawah ini pas di bawah kode ]]></b:skin>
- Selanjutnya silakan simpan template blog Anda dan tutup juga halaman edit HTML-nya.
- Kemudian silakan pilih lagi layout, lalu pilih dan klik Add Gadget pada posisi mana saja.
- Setelah muncul windows Add Gadget Blogger, silakan pilih HTML/JavaScript dengan cara klik tombol plus [+] yang ada disebelah kanannya.
- Langkah selanjutnya, silakan copy kode di bawah ini dan paste pada bagian content.
- Setelah dipaste kodenya pada bagian content, jangan dulu disimpan kodenya tapi silakan ganti kode yang saya kasih warna merah dengan alamat atau URL halaman fan page facebook Anda. Setelah diganti kode yang berwarna merah, barulah disimpan kodenya.
- B. cara membuat facebook comment di blog
2. Kunjungi url ini: developers.facebook.com/setup
3. Isi kotak yang tersedia sbb: Lihat gambar dibawah ini
Isikan App Display Name sesuai ke ingginan, kosongkan saja App Namespacenya, dan centang pada Agreement lalu continue.
4. Klik Continue/Lanjutkan. kemudian muncul window verifikasi kata dan isikan kata yang telah diberikan.
5. Setelah itu muncul window baru berupa App ID, Lihat gambar dibawah ini:
"App id" adalah nomor aplikasi id fb Anda. Catat dan simpan nomor App id tersebut di notepad atau ms.word. ini akan diperlukan nantinya.
Alamat blog/situs harus ditambahkan ke aplikasi yang dibuat. Tanpa itu, akan muncul warning di kotak komentar blog seperti "Warning: the url --- is Unreachable". Berikut cara menambah alamat blog:
- Masuk/login ke aplikasi Anda yang tadi dibuat. Atau kunjungi link ini: https://developers.facebook.com/apps/nomor-app-id-anda/ (ganti nomor-app-id-anda dengan nomor aplikasi Anda).
- Klik Edit Settings (kanan atas)
- Pada "Select how your app integrates with Facebook" -> klik Website (paling atas)
- 4. Masukkan alamat url blog anda. Contoh, http://super-bee.blogspot.com/ (jangan lupa diakhiri dengan garis miring).
- Klik Save Changes
Jika muncul popup fb HTML, huraukan saja karena saya sudah mempersiapkannya untuk Anda.
Kembali ke Blog Anda :
1. Masuk/login ke blogger.com -> Template -> Edit HTML -> Lanjutkan -> tanda tik pada Expand Widget Template
2.Cari kode seperti dibawh ini : (tekan ctrl+f) "kode dibawah biasa berada paling atas"
<html b:version='2' class='v2' expr:dir='data:blog.languageDirection' xmlns='http://www.w3.org/1999/xhtml' xmlns:b='http://www.google.com/2005/gml/b' xmlns:data='http://www.google.com/2005/gml/data' xmlns:expr='http://www.google.com/2005/gml/expr' xmlns:fb='http://www.facebook.com/2008/fbml'>
dan masukkan kode dibawah ini : (lihat kode diatas)
xmlns:fb='http://www.facebook.com/2008/fbml'
3. Kemudian cari kode </head> ,dan letakkan kode berikut ini 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='NAMA BLOG ANDA' property='og:site_name'/><meta content='App ID' property='fb:app_id'/><meta content='ID Profil Anda' property='fb:admins'/><meta content='article' property='og:type'/>
PENTING: Lihat tulisan yang berwana merah...
a. Ganti tulisan NAMA BLOG ANDA sesuai nama blog/situs anda.
b. Ganti tulisan APP ID ANDA dengan nomor aplikasi id Anda yang di save ke notpad tadi.
c. Ganti ID PROFIL FB dg yang sesuai. Contoh : https://www.facebook.com/profil/100000149724303
4. Cari kode </head> seperti no 3 tadi dan letakkan kode berikut ini tepat dibawah kode </head>
<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>
<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>
Ganti tulisan merah dengan App ID Anda yang telah Anda simpan kedalam notepad tadi.
5. Cari kode seperti dibawah ini :
<a class='timestamp-link' expr:href='data:post.url' rel='bookmark' title='permanent link'><abbr class='published' expr:title='data:post.timestampISO8601'><data:post.timestamp/></abbr></a>
</b:if>
</b:if>
</b:if>
</b:if>
6. Tambahkan kode dibawah ini tepat dibawahnya :
<b:if cond='data:blog.pageType == "item"'>
<div class='fb-comments' data-num-posts='2' data-width='450' expr:data-href='data:post.url'/>
</b:if>
Contoh : Lihat dibawah ini..
<div class='fb-comments' data-num-posts='2' data-width='450' expr:data-href='data:post.url'/>
</b:if>
Contoh : Lihat dibawah ini..
title='permanent link'><abbr class='published' expr:title='data:post.timestampISO8601'><data:post.timestamp/></abbr></a>
</b:if>
</b:if>
<b:if cond='data:blog.pageType == "item"'>
<div class='fb-comments' data-num-posts='2' data-width='450' expr:data-href='data:post.url'/>
</b:if>
</b:if>
</b:if>
<b:if cond='data:blog.pageType == "item"'>
<div class='fb-comments' data-num-posts='2' data-width='450' expr:data-href='data:post.url'/>
</b:if>
7. Save Template Anda.
Seperti yang saya sampaikan diatas tadi, seharusnya langkah-langkah diatas berhasil, karena saya sudah mempraktekkannya "lihat facebook comment saya". Jika Anda tidak berhasil mungkin template yang Anda miliki adalah template blogger baru, atau anda kurang teliti membaca langkah-langkah diatas
1. Sayang sekali jika ingin memakai Blogspot harus punya account gmail dulu baru bisa daftar.
2. Template standar bawaan biasa saja dari segi desain, begitu juga jika kita menambahkan template yang di dapat dari luar agak begitu ribet bagi seorang pemula.
3. Tampilan Blogger terkesan kurang professional menurut saya, entah apa alasannya setelah saya banyak
membandingkan Blogspot dengan WordPress.
4. Dashbord editing post-nya kurang lengkap. Menulis artikel tidak bisa leluasa sesuai selera.
5. Layout-nya biasa saja.
6. Agak ribet jika ingin mengganti template dari luar.
6. Perbedaan Blogspot dan Wordpress2. Template standar bawaan biasa saja dari segi desain, begitu juga jika kita menambahkan template yang di dapat dari luar agak begitu ribet bagi seorang pemula.
3. Tampilan Blogger terkesan kurang professional menurut saya, entah apa alasannya setelah saya banyak
membandingkan Blogspot dengan WordPress.
4. Dashbord editing post-nya kurang lengkap. Menulis artikel tidak bisa leluasa sesuai selera.
5. Layout-nya biasa saja.
6. Agak ribet jika ingin mengganti template dari luar.
WordPress muncul pertama kali di tahun 2003 hasil kerja keras Matt Mullenweg dengan Mike Little. Yang membuat WordPress makin terkenal, selain karena banyaknya fitur dan tampilan yang menarik, adalah juga karena dukungan komunitas terhadap perangkat lunak sumber terbuka untuk blog. Sedangkan Blogspot adalah sebuah layanan publikasi blog yang didirikan oleh Pyra Labs, dan diakuisisi oleh Google pada tahun 2003.
