Archive

Archive for May, 2010

Customize Fan Page Facebook denga Static FBML

Untuk membuat FBML static tidak terlalu sulit, silahkan ikuti langkah-langkah berikut:

1. Log in Facebook kemudian masuk ke halaman fan page kita.

2. Pilih edit page yang berada di sebelah kiri, di bawah foto.

3. Lihat di Applications cari FBML jika tidak ada pilih More Application -> Browse more

4. Ketikan static fbml pada field search Apps pada kiri atas setelah tulisan all Application kemudian enter.

5. Pilih static  fbml maka kita akan menuju halaman static FBML.

6. Pilih Add to my page pada kiri atas page setelah logo dari FBML.

7. Pilih Fan page kita dengan memilih add to page yang terletak disebelah kanan judul dari fan page kita,Setelah itu masuk kembali ke halaman fan page kita dan ikuti langkah 1 dan 2 diatas kemudian pada applications akan terlihat aplicasi yang bertuliskan FBML, lalu Pilih edit.

8. Berikutnya kita diminta memasukan Box Title => Digunakan untuk judul dari FBML kita yang akan muncul di tab yang terdapat di awal fan page kita Misal isikan Portfolio, dan FBML => digunakan untuk memasukan script FBML kita untuk sementara masukan,, saya masuk FBML fan page saya,,

9. Publish FBML kita : Lihat langkah no 8 pilih Apllication setting lalu buat seperti ini:

10. Kemudian Pilih wall setting dan setting seperti ini:

Terakhir kembali ke Fan page anda dan taraaaaaaaaaaa liat di tab anda akan muncul tab dengan judul Portfolio dan silahkan buka.

What Is FBML ?

Semakin maraknya penggunakan facebook di seluruh dunia, membuat para creator-creator facebook semakin mengembangkan ide-ide mereka agar dapat membuat facebook dapat lebih berguna, maka munculah salah satunya FBML (Facebook Markup Language).

FBML secara garis besar adalah suatu tehnik pemrograman yang dapat digunakan bagi programmer untuk berinteraksi dengan facebook mereka.

FBML banyak sekali digunakan para pengguna facebook untuk menampilkan produk-produk, membuat tampilan facebook menarik atau mungkin menampilkan sesuatu yang dapat membuat seseorang mengunjungi website mereka ke dalam Facebook Fan mereka.

Berikut contoh hasil penggunaan FBML Static Bisa Di klik disini,

Untuk sample page FBML saya tampilin halaman page blog saya hehehehe, gapapa ya sekalian Promosi,

Berikut nya Cara pembuatannya, Selamat menikmati.

Namespace And Jquery

Pada penulisan sebelumnya sudah dijelaskan secara singkat mengenai Jquery dan juga Namespace nah sekarang gmn ya kalo Kedua nya kta gabungin,, mari dicoba,, kita akan membuat sebuah input type yang user dan password dimana jika user dan password kita isikan dengan kata yang sama maka setelah klick submit akan muncul sebuah alert dengan kata-kata user dan password benar, dan begitu pula sebaliknya.

pertama kita bikin core.js nya:

//Create Namespace
var test = {}
//Declare variable global Jika ada kalo ngak ada kosongin aja;
{test.utils=function(){
return {
attach:function (){
$(document).ready(function(){
//taruh semua yang berhubungan action disini

$(“#submit”).click(function(){test.utils.save();})
$(“#clear”).click(function(){test.utils.clear();})
});
},
save:function(){
var nama    = $(“#nama”).val();
var pass    = $(“#pass”).val();

if (nama == pass){
alert (“Data Yang anda Isikan sama”);
}else{
alert (“Data Yang anda Isikan berbeda”);
}
},
clear:function(){
$(“#nama”).val(“”);
$(“#pass”).val(“”);
}
}
}()}

Trus Buat File index.htmlnya

<html>
<head>
<script src=”jquery.min.js” language=”javascript” type=”text/javascript”></script>
<script src=”core.js” language=”javascript” type=”text/javascript”></script>
<script language=”javascript”>
window.onLoad = test.utils.attach();
</script>
</head>
<body>
<input type=”text” name=”nama” id=”nama” size=”20″>
<input type=”password” name=”pass” id=”pass” size=”20″> <br />
<input type=”button” name=”submit” id=”submit” value=”save”>
<input type=”button” name=”clear” id=”clear” Value=”clear”>
</body>
</html>

Jangan lupa File Jquery.jsnya ya silah kan pilih de www.jquery.com kalo saya pake yang .min

dan jalankan

kalo mau download file lengkapany silahkan unduh di :

http://www.ziddu.com/download/9852103/namespace.zip.html

Kalo ada yang punya cara berbeda please sharing ya,,hehehehhe

//Create Namespace
var test = {}
//Declare variable global Jika ada kalo ngak ada kosongin aja;
{test.utils=function(){
return {
attach:function (){
$(document).ready(function(){
//taruh semua yang berhubungan action disini

$(“#submit”).click(function(){test.utils.save();})
$(“#clear”).click(function(){test.utils.clear();})
});
},
save:function(){
var nama    = $(“#nama”).val();
var pass    = $(“#pass”).val();

if (nama == pass){
alert (“Data Yang anda Isikan sama”);
}else{
alert (“Data Yang anda Isikan berbeda”);
}
},
clear:function(){
$(“#nama”).val(“”);
$(“#pass”).val(“”);
}
}
}()}

What is Namespace?

Namespace ada metode penulisan javascript dalam bentuk yang berbeda sehingga lebih mudah dalam penggunaan pada waktu yang lain,
Contoh penggunaannya adalah sebagai berikut :

//Create Namespace
var test = {}
//Declare variable global Jika ada kalo ngak ada kosongin aja;
{test.utils=function(){
return {
hello:function (){
var text =”helloworld”;
alert(text);
}
}
}()}
Save sebagai test.js
Kemudian lanjutkan penulisan script html berikut:

<html>
<head>
<script src=”test.js” language=”javascript” type=”text/javascript”></script>
<script language=”javascript”>
window.onLoad = test.utils.hello();
</script>
</head>
<body>
</body>
</html>

save sebagai test.html
dan jalankan test.html maka akan muncul :

Berikutnya kita Duetkan ama Jquery,

PHP CLASS RESIZE IMAGE ON THE FLY

Setelah mencari-cari dan browsing sana sini, mengumpulkan script yang didapat dan di modifikasi akhirnya terbentuk lah class yang dapat meresize image on the fly.

Terkadang orang ketika mengupload gambar untuk web selalu mengupload dua gambar satu untuk thumbnail dan yang satu untuk versi large nya, jika hanya terdapat 2 gambar yang ngak papa tapi kalo ada banyak luar binasa namanya, tapi tergantung kapasitas servernya juga sich.

mudah-mudahan class ini bisa berguna silahkan unduh deh :

http://www.ziddu.com/download/9828319/image_resize.zip.html

Cara makenya eh menggunakannya gampang  rubah aja file index.php nya,

include “class.php”;
header(‘Content-Type: image/jpeg’);
$image = new SimpleImage();
$image->load(“Image_00002 copy.jpg”);  ==> nama filenya kalo ada diluar folder ya tambahin ../Image_00002 copy.jpg
$image->resizeToHeight(80); ==> ini fungsi yang mau kita gunakan ada banyak pilihan lo:

1.resizeToHeight

2.resizeToWidth

3.scale ini dalam persen ya

4.resize ini harus diisi width ama heightnya

$image->output();

Gmn Mudahkan temukan cerita-cerita program yang lain di episode berikutnya

daaaaaaaaaaaaaaaaaaaaaaaaa……………………..


Follow

Get every new post delivered to your Inbox.