- Panduan Membuat Layout Overlay Friendster
- Customizing Friendster Layout

Baik, mungkin sedikit mengulang mengenai profil Friendster Overlay, teknik overlay disini seperti ini:
“Saat browser kita me-load halaman profile Friendster, kita sisipkan suatu perintah javascript untuk memanggil halaman baru yang akan me-nimpal (meng-override atau meng-overlay) halaman profile Friendster kita yang asli. Dimana halaman baru ini merupakan suatu tampilan profile Friendster yang telah kita kostumasi sedemikian rupa agar tampak beda.”
Nah, untuk “halaman baru” ini bisa kita buat dengan program semisal Adobe Photoshop dan Dreamweaver, atau Frontpage atau apapun program favorit kamu untuk membuat atau mendesain tampilan web (halaman web-site).

Ya, “halaman baru” yang dimaksud disini adalah sama dengan 1 halaman yang mempunyai tampilan web seperti website lainnya. Hanya saja, disini, kita akan meng-khusus-kan agar si halaman baru ini mewakili atau isinya mengenai profil kita di friendster.

Sebagai contoh, ini ada 1 desain layout FS yang dulu pernah saya pakai:

Klik pada gambar untuk memperbesar.
Untuk mendownload file sumber (html dan gambar) pada server 1, klik disini.
Untuk mendownload file sumber (html dan gambar) pada server 2, klik disini.

Untuk tahap awal, silahkan download file sumber dan edit seperlunya.
Adapun hal-hal yang perlu di edit adalah:

- kode userid FS
Untuk mengganti userid, buka file template1.html dengan notepad atau program html editor semisal Dreamweaver dan cari kode ini: uid=14340520 kode angka 14340520 merupakan kode userid saya di Friendster, jadi silahkan ganti dengan userid FS anda.
- kode id cbox
Bagi yang belum tahu apa itu cbox: cbox merupakan media chat secara online yang bisa dipasang pada blog atau website. Silahkan menuju halaman http://www3.cbox.ws untuk berlangganan dan ganti kode berikut ini:

- Silahkan ganti saja apa yang menurut anda perlu :p

Silahkan upload gambar pada folder images ke situs image hosting semisal http://imageshack.us

Setelah anda mengupload gambar-gambar pada folder images, silahkan ganti link gambar pada file template1.html dan ganti dengan alamat link gambar yang telah anda upload.

Ganti alamat yang ada pada doublequote-nya misal:
Dimana http://imageshack.us/2_01.jpg merupakan alamat link gambar yang telah anda upload. Lakukan hal yang sama pada semua gambar.

Ok, setelah anda mengganti semua alamat link, silahkan buka halaman www.markyctrigger.com dan pilihlah (klik) OGStandard 11 sehingga muncul jendela berikut:

Buka file template1.html tadi dengan notepad dan Pilih Semua text yang ada dengan memencet tombol Ctrl+A kemudian Copy dan Paste di jendela di halaman www.markyctrigger.com, pada bagian Step 1 (Insert your Html codes Here).
Kemudian klik tombol Generate!.
Silahkan Copy kode baru yang muncul dan Paste di bagian Add Media pada profile Friendster kamu (editskin).

Silahkan berkreasi dengan mendesain tampilan yang baru, edit gambarnya atau sekalian saja membuat gambar background baru, ganti dengan foto kamu kalo perlu.

Met berkreasi ya… ^_^

Untuk mendownload Overlay Friendster yang sudah jadi, silahkan lihat dan download di: all-about-friendster.blogspot.com

Atau, silahkan lihat bacaan berikut agar lebih jelas:
- Mengganti Background di Friendster
- Membuat Overlay Friendster -Komplit Bo
- Panduan Membuat Layout Overlay Friendster
- Customizing Friendster Layout

Oh iya, sedikit tambahan dari bang P-Man:

Sebenernya semua tutorial mengenai overlay or add-on FS ada di situs www.markyctrigger.com …trus biar lebih jelasnya masuk forumnya.

Prinsip dasarnya :
1. Anda harus mengenal terlebih dahulu bahasa .html atau action script flash (itu pilihan; kaya bikin website)
2. Untuk grafisnya anda bisa bikin sendiri (mau itu pake photoshop, etc.)
3. Ada “module” (untuk menampilkan foto, comment, profile, menu, etc.) yang harus anda masukkan ke dalam file .html atau flash anda. Dan letaknya bisa anda custom sendiri. “Module” terkadang di update (cek di forum markyctrigger) karena FS sering meng-update sistem mereka.
4. File .html ato flash anda yg telah jadi harus di generate memakai overlay generator (OG) yang disediakan di http://www.markyctrigger.com (pilihan OG sesuai kebutuhan anda).
5. Setelah di-generate biasanya anda harus meng-upload ke Media Area di FS. Tapi sebelumnya tekan “Revert” terlebih dahulu sebelum anda “save” script yg telah di generate td tsb.

Untuk mendownload Overlay Friendster yang sudah jadi, silahkan lihat dan download di:
all-about-friendster.blogspot.com dan
Unique Friendster Layout

Berikut adalah beberapa tulisan saya mengenai Friendster Layout yang mungkin berguna:
- Panduan Membuat Layout Overlay Friendster
- Mengganti Background di Friendster
- Membuat Overlay Friendster -Komplit Bo
- Customizing Friendster Layout

Untuk cara bagaimana menyimpan atau meng-upload gambar ke internet alias tempat hosting image semisal Imageshack, baca artikel ini:
Upload Image di Imageshack.us Untuk Friendster-an.

Langsung aja, pada dasarnya overlay untuk layout Friendster adalah desain web biasa yang ditambahin script dikit biar bisa dipakai untuk menggantikan layout yang ‘biasa’ di Friendster.

Dari bagian Customizing The Friendster Layout, saya kutip sedikit:
“Dasar teknik overlay profile Friendster ini adalah seperti ini:
Saat browser kita me-load halaman profile Friendster, kita sisipkan suatu perintah javascript untuk memanggil halaman baru yang akan me-nimpal (meng-override atau meng-overlay) halaman profile Friendster kita yang asli. Dimana halaman baru ini merupakan suatu tampilan profile Friendster yang telah kita kostumasi sedemikian rupa agar tampak beda.”

Dimana yang dimaksud dengan ‘halaman baru’ ini adalah desain web (1 halaman) yang telah di-utak-atik agar mempunyai link-link atau hal-hal yang berkaitan dengan profil Friendster kita. Jadi, jika di halaman asli profil Friendster ada link untuk ‘View Comments’, ‘Add Comments’, ‘View Blog’, ‘Home’ dan sebagainya, maka kita buat juga link-link tersebut di desain web yang kita inginkan untuk meng-overlay (me-nimpal atau meng-override) halaman asli profil Friendster kita.
Jadi, kalo ingin bisa menggunakan teknik ‘Layout Overlay Friendster’ ini, setidaknya temen-temen harus punya bekal setidaknya mengetahui pengetahuan dasar mengenai html, dan lebih baik lagi mengenai css.

Oke, sampai sini saya harapkan temen-temen sudah ada gambaran mengenai apa yang akan kita lakukan.

Sebelum melangkah lebih lanjut, saya harapkan temen-temen sudah punya 1 desain halaman web yang bisa dipakai. Untuk masalah link-link untuk halaman baru, bisa di-save dari halaman asli profil Friendster temen-temen.

Setelah jadi desain web halaman baru tadi (ada link-link dan profil baru kamu, terserahlah…), uploadlah file-file gambar yang akan dipanggil oleh halaman tersebut ke layanan upload gambar gratis, semisal imageshack.us. Setelah selesai di-upload, jangan lupa mengganti link-link gambar di desain web halaman baru agar mengarah ke alamat gambar-gambar yang telah di-upload.

Setelah selesai, mari kita buka situs www.markyctrigger.com.

Di halaman www.markyctrigger.com, kita akan menemukan link-link berikut:

OGStandard v10.4
The most popular Overlay Generator for friendster. With the power of AJAX, OGstandard is the fastest among the other Overlay Generator for friendster. By using the Overlay Add-ons, you don’t need to worry about spawning your testimonials, friends, groups, blogs etc. plus! you can also have additional functionalities such as “who viewed your profile”,”anti-poser” etc.

OG++
OG++ enables you to apply external source code to overcome friendster character limitations. Like OGstandard, OG++ also supports friendster add-ons with no problems.

OGFlash
If you’re a flash master or you’re using flash to cover up your friendster profile, then this is the right Overlay Generator for you. With OGflash, Major friendster add-ons are supported inside your flash profile.

OGMultiply
Is an exclusive Overlay Generator for http://www.multiply.com. With OGmultiply, you can use multiply add-ons to spawn your contents easily. so what are you waiting for? take generate your code and take advantage with OGmultiply.

OGXanga
Is an exclusive Overlay Generator for http://www.xanga.com. OGxanga is currently on beta stage with no add-on support.

OGDownelink
Is an exclusive Overlay Generator for http://www.downelink.com. OGdownelink is currently on beta stage with no add-on support.

Ok, pasti pusing kan,… Hehe…
Yang jelas, untuk memakai overlay layout di friendster, kita bisa memakai OGstandard, OG++ dan OGflash. Perbedaan yang utama dari ketiga Overlay Generator (OG) tersebut adalah perbedaan peruntukan.

Dengan OGstandard, maka file halaman baru kita yang telah di-generate akan disimpan di Media Box di halaman http://www.friendster.com/editskin.php

Dengan OG++, maka file halaman baru kita yang telah di-generate akan disimpan di luar (dalam artian di situs atau alamat lain), dan hanya menyimpan file pemanggil halaman tersebut di Media Box. Jadi, dengan OG++, yang terjadi adalah redirect halaman profil friendster kita.

Sedangkan OGflash, dipergunakan untuk halaman baru kita yang mengandung animasi flash.

Klik pada Overlay Generator untuk men-generate halaman overlay kamu.
Yah, sekian dulu.

Selamat menikmati… ^_^

nb: Lebih lengkap lagi, baca disini:
Membuat Overlay Friendster -komplit bo

Untuk mendownload Overlay Friendster yang sudah jadi, silahkan lihat dan download di:
all-about-friendster.blogspot.com dan
Unique Friendster Layout

Berikut adalah beberapa tulisan saya mengenai Friendster Layout yang mungkin berguna:
- Panduan Membuat Layout Overlay Friendster
- Mengganti Background di Friendster
- Membuat Overlay Friendster -Komplit Bo
- Customizing Friendster Layout

Untuk cara bagaimana menyimpan atau meng-upload gambar ke internet alias tempat hosting image semisal Imageshack, baca artikel ini:
Upload Image di Imageshack.us Untuk Friendster-an.

Seperti yang kita tahu, bahwa untuk mengkostumasi atau merubah profile kita di Friendster kita menggunakan CSS, dimana dengan merubah-rubah nilai-nilainya maka kita bisa mendapatkan efek seperti kotak-kotak bergaris yang mengitari profile kita, serta background kotak-kotak yang transparan sehingga gambar background dapat terlihat dengan jelas melaluinya atau menjadi polos sama sekali.

Mungkin teman-teman yang mempunyai profile di Friendster akhirnya mendapati suatu tembok tinggi yang membatasi kreativitas teman-teman dalam merubah tampilan profile di Friendster. Mengapa demikian…???

Ya, mengapa demikian,…??? (balik nanya ceritanya…)
Saya sendiri mengalami hal tersebut saat saya ingin merubah tampilan profile Friendster saya agar tampak seperti tampilan suatu situs biasa, atau setidaknya merubahnya agar tidak tampak seperti tampilan profile Friendster pada umumnya.

Dibekali niat ingin merubah dan penasaran tersebut, saya mendapati bahwa di luar sana (di internet) terdapat orang-orang yang kurang lebih seperti saya. Tidak lama setelah itu, saya pun mengetahui bahwa teknik untuk merubah tampilan profile saya ini dinamakan overlay.

Dengan teknik overlay ini, kita bisa merubah tampilan profile kita dengan bebas dan lebih menuangkan kreativitas dalam mendesain tampilan profile kita, disini batasannya adalah kreativitas kita sendiri (cie…)

Dasar teknik overlay profile Friendster ini adalah seperti ini:
Saat browser kita me-load halaman profile Friendster, kita sisipkan suatu perintah javascript untuk memanggil halaman baru yang akan me-nimpal (meng-override atau meng-overlay) halaman profile Friendster kita yang asli. Dimana halaman baru ini merupakan suatu tampilan profile Friendster yang telah kita kostumasi sedemikian rupa agar tampak beda.
Ok, sampai sini pasti bingung kan…!!!!

Untuk lebih jelas, kita lihat situs www.markyctrigger.com.
Karena semua hal yang kita perlukan untuk merubah tampilan profile Friendster kita, semuanya ada di sana.

…bersambung

Untuk mendownload Overlay Friendster yang sudah jadi, silahkan lihat dan download di:
all-about-friendster.blogspot.com dan
Unique Friendster Layout

Berikut adalah beberapa tulisan saya mengenai Friendster Layout yang mungkin berguna:
- Panduan Membuat Layout Overlay Friendster
- Mengganti Background di Friendster
- Membuat Overlay Friendster -Komplit Bo
- Customizing Friendster Layout

Untuk cara bagaimana menyimpan atau meng-upload gambar ke internet alias tempat hosting image semisal Imageshack, baca artikel ini:
Upload Image di Imageshack.us Untuk Friendster-an.