jQuery: Visitor Notification

How it works

Visitor Notification ini memanfaatkan wall facebook page untuk menyimpan data pengunjung dan menggunakan facebook graph API untuk membaca data dari wall page.

Data pengunjung yang disimpan disini atara lain:: ✩ Facebook ID pengunjung; ✩ URL halaman yang dikunjungi; ✩ Judul halaman yang dikunjungi; ✩ Jenis browser yang digunakan pengunjung

Untuk Facebook ID pengunjung kita dapet dari Facebook Connect tentunya, jadi kalo kita gak pasang facebook connect di blog, percuma jadinya, karena kita gak tau siapa sipengunjung ini.

Cara Pasang

Pastiin Library jQuery sama Plugin jQuery Ui berikut udah ada dibagian <head>.

Kalo belom ada, silahkan pasang tepat diatas tag </head> dari template blog.

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.3/jquery.min.js" type="text/javascript"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/jquery-ui.min.js" type="text/javascript"></script>

Terus bikin Widget HTML/Javascript baru dibagian paling bawah Layout Blog dan isi kira-kira kaya gini:

Yang diatas itu baru CSS pendukungnya aja,,

Sekarang tinggal nambahin baris berikut setelah CSS yang di atas tadi

<script type="text/javascript">
  $.ajax({url:'http://aing-creations-template.googlecode.com/files/notipAing.js',dataType:'script',cache:true,success:function(){
    blognotip.bikinNotip();
  }});
</script>

Save Widget HTML/Javascript yang lo bikin barusan dan lihat hasilnya.

Kalo pengunjung di blog elo gak kecatet dinotif ini, berarti blog elo belom ada connect facebooknya atau gak ada variable idUserYgLogin nya. Silahkan baca-baca di How to Connect Facebook with Blog.

Menggunakan Wall Facebook Page sendiri

Biar Notif visitor kita gak campur-campur sama visitor blog orang, silahkan bikin 2 facebook page sendiri dan ambil access tokennya. Kita pake 2 page karena yang satu buat nyimpen data visitor, yang satu lagi buat nyimpen data event seperti menekan tombol like atau berkomentar pada facebook plugin.

Tinggal ganti aja script nya jadi kaya gini..

<script type="text/javascript">
  $.ajax({url:'http://anazcode.googlecode.com/files/visitor.js',dataType:'script',cache:true,success:function(){
    window.visrecGue='26613742xxxxxxx|AAACqnvXzYOcxxxxxx';
    window.evrecGue='104181253xxxxxxx|AAACqnvXzYOcBxxxxxx';
    blognotip.bikinNotip();
  }});
</script>

Cara dapetin Access token Facebook Page:: Gunakan ID Aplikasi yang bisa memberikan Offline access permission agar access token tidak expire. Misalnya Nokia (49340319393) atau Experia (104018109673165).

Application ID:

Check this App
Update status

Insert token
Get Token
Atau langsung tekan tombol Insert token kalo emang udah punya.; Masukan Access token atau Full URL dari addressbar popup yang keluar setelah menyetujui beberapa permisi akses :P ( malah susah kata-katanya pake bahasa indonesia xP ) lalu tekan tombol Okay. Pastikan dibagian ujung &expires_in=0 yang berarti Access token never expire.

Access_token or Full URL from popup window:

Change App
Okay

Kalo ada yang kurang jelas, komen aja dibawah, siapa tau ada temen-temen yang lain yang bisa bantu :D

wk kabooooooooooooorrrrrrrrr.... XD

OnMitra Creations

Navbar

Global Var

Sabtu, 29 September 2012