thank to: imzers, joy, underdos, bang kanal
Tweaking Friendster Profile
Dengan Injeksi CSS dan JAVASCRIPT
( BAGIAN SATU )
Hmmmm.....Friendster lage friendster lage
Sebenernya gue lagi sibuk banget nehhh… Sedang dilanda kesibukan kuliah yang teramat
sangat memberatkan dan akhirnya menjadikan raga ini teramat letih (xaxa. .)… Namun ada sebuah rasa
tanggung jawab untuk menyebarkan sedikit pengetahuan yang gue punya…
Kebetulan maren onlen di ym ada yang nanya nanya gtu tentang edit friendster..hehe..
Ya udah lah daripada ngelez lama lama mending gue bikinin tutorialnya ajah dech...
Special buat maz Bjm_spyono
So… Awal kata atau bahasa kerenya pembukaan atau preambule cukup sekian dulu… Gue harap jika ada kesalahan penulisan kata dan tata bahasa
maka harap dimaklumkan berhubung kondisi gue yang kurang memungkinkan (fyuh kebanyakan alasan)
thank to: imzers, rudy joy, underdos, bang kanal dan semua temen temen fb yang udah banyak ngajarin gue edit friendster..…. . .
(xexe....makasi yakz temen temen!!),,mending kalo mau nanya2 tentang friendster ke master2 ini aja yach...
Nah… Gue harap sedikit tutorial ini bisa membuka wawasan, ilmu, pengetahuan (halah...perasaan sama aja dech!!) kalian agar mendapat
pencerahan… Langsung kita mulai… Dari dasar sekalian yahhh… Biar lebih jelas…
Gue bukan MASTER dan sangat jauh dari itu… Gue cuman newbie bodoh yang pengen sharing apa yang gue bisa saat ini… . ..Key??simpen itu. . .
Lalu Metode apa yang akan kita gunakan…???
Disini gue akan melakukan TWEAKING dengan menggunakan CSS dan Variasi
JAVASCRIPT yang dilakukan dengan EKSTERNAL FILE kemudian di injeksikan
menggunakan LINKER kedalam PROFILE FRIENDSTER ...(hehe ...ribet gak nech!!)
Ok Pemirsa Pahami dulu beberapa pengertian berikut…!!!
Cascading Style Sheets (CSS) adalah suatu bahasa stylesheet yang digunakan untuk
mengatur tampilan suatu dokumen yang ditulis dalam bahasa markup. Penggunaan yang
paling umum dari CSS adalah untuk memformat halaman web yang ditulis dengan
HTML dan XHTML. CSS digunakan oleh penulis maupun pembaca halaman web untuk
menentukan warna, jenis huruf, tata letak, dan berbagai aspek tampilan dokumen.
CSS digunakan terutama untuk memisahkan antara isi dokumen (yang ditulis dengan
HTML atau bahasa markup lainnya) dengan presentasi dokumen (yang ditulis dengan
CSS). Pemisahan ini dapat meningkatkan aksesibilitas isi, memberikan lebih banyak
keleluasaan dan kontrol terhadap tampilan, dan mengurangi kompleksitas serta
pengulangan pada stuktur isi. (diambil dari buku komputer sma)
CSS memungkinkan halaman yang sama untuk ditampilkan dengan cara yang berbeda
untuk metode presentasi yang berbeda, seperti melalui layar, cetak, suara (sewaktu
dibacakan oleh browser basis-suara atau pembaca layar), dan juga alat pembaca Braille.
Halaman HTML atau XML yang sama juga dapat ditampilkan secara berbeda, baik dari
segi gaya tampilan atau skema warna dengan menggunakan CSS.
CSS bisa mengontrol/mengatur seluruh tampilan halaman web dengan hanya sebuah
dokumen CSS. Secara default, ekstensi untuk file CSS adalah .css (dot css).
Singkatnya, CSS adalah sebuah dokumen yang digunakan untuk mengatur layout
PROFILE FRIENDSTER kamu misalnya : background (BG) image, warna huruf/font,
jenis huruf/font, warna border, dll.
Javascript (JS) adalah bahasa pemrograman yang khusus untuk halaman web agar
halaman web menjadi lebih hidup. Kalau dilihat dari suku katanya terdiri dari dua suku
kata, yaitu Java dan Script. Java adalah Bahasa pemrograman berorientasi objek,
sedangkan Script adalah serangkaian instruksi program.
JavaScript merupakan implementasi Netscape Communications Corporation untuk
ECMAScript standar yaitu suatu bahasa skripting yang didasarkan pada konsep
pemrograman berbasis prototype. Bahasa ini terutama terkenal karena penggunaannya di
situs web (sebagai JavaScript Client Side) dan juga digunakan untuk menyediakan akses
skripting untuk objek yang dibenamkan (embedded) di aplikasi lain. Untuk yang terakhir
ini umum digunakan untuk HACKING FRIENDSTER. Terutama dengan metode
INJEKSI FLASH OBJECT untuk melakukan Take Over Account.
Walaupun memiliki nama serupa, JavaScript hanya sedikit berhubungan dengan bahasa
pemrograman Java, kesamaan utamanya hanyalah penggunaan sintaks C. Secara
semantik, JavaScript memiliki lebih banyak kesamaan dengan bahasa pemrograman Self.
JavaScript (selanjutnya hanya ditulis “JS”) kita gunakan untuk TWEAKING jika loe
mau menambahkan beberapa macam fungsi tambahan, misalnya Welcome Page, Who
Viewed Me (WVM), No Rite Click, Berbagai Alert Box, Slideshow, IP Tracker,
Chatbox, dll. Untuk segi HACKING bisa digunakan untuk FAKE LOGIN dll
Tweaking adalah sebuah proses untuk meningkatkan kapasitas dan atau kualitas. Dalam
hal ini adalah mempercantik PROFILE FRIENDSTER kita lebih dari fasilitas standar
yang disediakan oleh pihak FRIENDSTER. Tweaking ini lah yang akan kita bahas dan
akan kita lakukan.
Eksternal File adalah sebuah file/dokumen yang kita upload/hosting dan dapat diakses
secara public. File ini nantinya akan berupa code-code baik itu CSS ataupun
JAVASCRIPT. File ini akan kita gunakan untuk mempercantik PROFILE
FRIENDSTER. Selanjutnya editing profile dilakukan pada file ini saja tanpa masuk ke
bagian CUSTOMIZE di FRIENDSTER.
Linker adalah sebuah code yang digunakan untuk memasukkan/menginjeksikan sebuah
file ke dalam sebuah situs dalam hal ini FRIENDSTER agar isi file tersebut dapat di
eksekusi oleh browser yang membuka PROFILE FRIENDSTER tersebut.
Banyak macam dari code linker yang digunakan. Karenanya ngga akan saya tulis disini,
coz ngga ada gunanya karena pihak FRIENDSTER akan terus melakukan PATCH pada
system mereka. Linker yang saya gunakan disini hanya contoh saja. Untuk linker yang
aktif/update silahkan cari sendiri yahhh… Hehehehehe… (silahkan tanya paman gugel..)
Ada beberapa orang yang kreatif dan menyediakan halaman untuk generate LINKER…. .
saya sendiri juga pernah membuat dan saat saya menulis tulisan ini ternyata akun saya di 110mb dibbanned...
waduh waduh...nasib gue sial banget.
dulu urlnya disini
http://kemalzack.110mb.com/index2.html
btw gue udah cari js linker terbatu, tapi kox ga jalan bozz??
hmmmm,,,mungkin friendster sudah mempatch linker tersebut, bukan tidak mungkin linker barupun akan dipatch. .
tapi tenang, kalau ada waktu insya allah saya akan menuliskan tutorial bikin javascript linkernya.
Kenapa pihak FRIENDSTER melakukan PATCH terhadap LINKER…???
Wahhh… Alasan yang pastinya silahkan tanya ama pihak FRIENDSTER sendiri…
Gue cuman bisa jawab seadanya… Ada beberapa linker yang bisa digunakan untuk
melakukan bypass XSS terhadap tampilan FRIENDSTER dan mengeksekusi beberapa
syntax atau string perintah pada file yang di sertakan…
Duuhhh… Yang bagian ini ngga usah dibahas yahhh… Ntar aza… Xixixixi…ilmu gue lom nyampe situ soalnya, Tapi kalo anda pengen belajar silahkan hubungi saja guru saya master underdos (ahlinya nech...!!).
Profile Friendster adalah halaman utama profile kita di FRIENDSTER yang bisa dilihat
oleh pengunjung. Misalnya Profile Friendster gue bisa diliat di URL berikut :
http://profiles.friendster.com/kemalzack (heheh....sekalian promosi)
Nah… Sudah jelas khan tentang definisi…
Sudah liat juga contoh dan hasil akhir dari apa yang akan kita lakukan…
P e n ge n … ???
Mari sama-sama belajar…
Melakukan TWEAKING dengan CSS
Ngga perlu pusing untuk membuat file CSS untuk profile kita coz banyak PROFILE
GENERATOR yang membantu kita untuk melakukan kompilasi CSS
Cukup siapkan TEXT EDITOR pilihan kamu… Yang standar boleh pake NOTEPAD
bawaan WINDOWS… Kalo gue lebih suka menggunakan NOTEPAD++.
CSS Generator dapat diakses pada URL berikut :
http://www.editfriendster.com
http://friendster-tweakers.com/tools/friendster-editor/
Silahkan kalian kreasikan sendiri CSS kalian… Mulai dari gambar background, warna,
jenis huruf, header, control panel, box dan sebagainya…
Setelah selesai bisa di preview hasilnya dan kalo cocok langsung aza generate…
Itu masih BASIC CODE dari CSS yang akan kita TWEAK…
Copy paste semua hasil generate code ke text editor kamu…
Kemudian save dengan ekstensi CSS misalnya gayague.css
Sabar… Perjalanan masih jauuhhh…
Untuk melakukan TWEAKING… Bisa berbagai cara dilakukan… Menggunakan CSS
saja juga memungkinkan… Untuk code code yang digunakan… …
Saat ini gue cuman memberikan sedikit contoh saja…
Bisa dipake koq… Kalo loe mau coba coba dulu…
Loe dah punya file CODE BASIC CSS yaitu gayague.css… Nah… Sekarang saatnya
kita modifikasi atau kita tweaking…
Buka file gayague.css kemudian tambahkan code code berikut ini :
/* ============================== Hidden Code Compilation */
/* ----------------------Hidden How You're Connected Box */
#meettrail { display: none; }
.meettrail {display:none!important;}
/* ------------------------------------Remove Top Banner */
.banner_ad_fix {display:none!important;}
/* ------------------------------------Remove All Header */
#navigation {display:none!important;}
/* ------------------------------------------Remove Logo */
.logo { display: none; background: transparent; }
#logo { display: none; }
/* -----------------------------------Remove Search Form */
#search { display: none; background: transparent; }
#search form { display: none; background: transparent; }
/* --------------------------------------Hide Google Ads */
#banneradrow { display: none; }
#ads_2_3{ display: none; }
#content_14 {display:none!important;}
/* ------------------------------Remove Featured Sponsor */
#marketing_bg{ display: none; background: transparent; }
/* ---------------------------------------Remove Fans Of */
.fanof {display:none!important;}
.myfans { display: none; }
/* ---------------------------------------Remove Friends */
#content_2 {display:none!important;}
.friends {display:none!important;}
/* -----------------------------------------------Groups */
.groups {display:none!important;}
/* --------------Hide About Me Paragraph In Control Panel*/
.controlpanel p {display:none!important;}
/* ----------------------------------Hide Recent Updates */
.user_tracker {display:none!important;}
/* --------------Hide About Me Link Above Recent Updates */
#content_0 a.more {display:none!important;}
/* ----------------------------------------Remove Footer */
#footer_container { display: none; }
#footer { display: none; }
/* -----------------------------Hide Your Featured Names */
#.friends {display:none!important;}
/* -------------------------------------Centering Header */
#mynav h1, #mynav h2 { /*header*/
text-align: center;
}
/* -------------------------------------------One Column */
.commonbox {
position: relative;
left: 158px!important;
overflow: hidden;
width: 570px;
}
/* ---------------------------------Transparent ShoutOut */
{transparent shoutout}
.controlpanel .so { margin: 0 -20px 10px 0; width: 257px;
position: relative; background:url() repeat-y top left; color:
#3CE403; font-weight: bold; }
.controlpanel .so a { color: #3CE403; }
.controlpanel .so div#cpShoutoutBox, .controlpanel .so
div#cpShoutoutEditBox { padding: 7px 7px 5px 7px; margin: 0; }
.controlpanel .so div#cpShoutoutEditBox { display: none; }
.controlpanel .sol { position: absolute; left: -5px; top: 8px;
width: 6px; height: 11px; background:url() no-repeat; }
.controlpanel .sob { width: 257px; height: 2px; background:url()
no-repeat; line-height: 0; font-size: 0; }
/* --------------------------------------Dropdown PHOTO */
#content_1{background: transparent; -moz-opacity: 0.7; -moz-
border-radius: 10px; text-align:center;
width: auto; height: 0px; overflow: hidden; padding: 10px 5px 10px
5px;}
#content_1:hover{background-color: transparent; -moz-opacity: 1; -
moz-border-radius: 10px; height: 100%; height:auto !important;}
/* -----------------------------Dropdown MORE ABOUT ME */
#content_6{background: transparent; -moz-opacity: 0.7; -moz-
border-radius: 10px; text-align:center;
width: auto; height: 0px; overflow: hidden; padding: 10px 5px 10px
5px;}
#content_6:hover{background-color: transparent; -moz-opacity: 1; -
moz-border-radius: 10px; height: 100%; min-height: 75px;
height:auto !important; height:75px; }
/* -------------------------------Dropdown TESTIMONIAL */
#content_18{background: transparent; -moz-opacity: 0.7; -moz-
border-radius: 10px; text-align:center;
width: auto; height: 10px; overflow: hidden; padding: 10px 5px
10px 5px;}
#content_18:hover{background-color: transparent; -moz-opacity: 1;
-moz-border-radius: 10px; height: 100%; height:auto !important;}
Nah…Setelah semua CODE itu ditambahkan di BASIC CODE CSS loe…
Save lagi… Jangan lupa yahhh… Ekstensi untuk CSS adalah .css (dot css)
tuch code ambil aja yang kira-kira diperlukan sesuain ndiri ma profile loe
Kenapa ngga langsung di masukkan ke box Customise CSS di edit friendster bozz..???
Hayooo kenapa… Kalo loe masukkan code tersebut disana…
Ngga semuanya bisa dijalankan… Karena bertentangan dengan BASIC CODE dari pihak
FRIENDSTER… Bisa jalan seehhh… Untuk beberapa code…
Makanya kita melakukan TWEAKING… Nantinya proses tweaking dilanjutkan dengan
melakukan upload kemudian menginjeksikan EKSTERNAL CSS kita ke dalam profile.
Bagaimana caranya…??? Saya ngga punya website nehhh apalagi hostingan…
Duuhhhh… Hari gini… Ngga punya website…???
Xixixixi… Mentang mentang baru punya website… Hehehehehe… >>> Intermezzo
No problem…Banyak koq yang gratis di internet…
Mulai yang biasa… Sampe yang seperti sungguhan dengan cPANEL dan sebagainya…
Gue jelaskan yang biasa aza yahhh… Versi cPANEL di tutorial berikutnya…
Loe Sign Up / daftar aza di http://www.ripway.com nie yang kenceng loadnya
Gratis dan tanpa dipungut biaya… Lumayan dengan kapasitas 30 MB…
Ngga perlu tutorial yah tentang cara daftar-nya… Terlalu kalo ngga bisa (haha. ..just kidding)…
Setelah loe login ke account RIPWAY… Loe pilih tombol My Files di menu utama…
Selanjutnya pilih bagian Upload Files
s
Klik Upload
Setelah proses upload selesai… Maka akan tampak di list file…
Untuk mengubah file… Loe tinggal klik Edit Text
Sekarang kita sudah memiliki EKSTERNAL CSS yang bisa diakses secara public
http://h1.ripway.com/kemalzack/gayague.css
Sekarang langkah terakhir… Yaitu menginjeksikan EKSTERNAL CSS ke dalam Profile
Friendster kamu… Untuk itu kita memerlukan LINKER…
Linker ini khusus untuk injeksi CSS saja… Dan terus update… So… Keep Stay In Touch
Linker diatas hanya contoh saja… Tapi sampai tulisan ini di upload…
Masih berfungsi untuk semua BROWSER koq… Silahkan dicoba dulu.. Kalo ngga...
Silahkan mencari linker yang update… Gabung dengan gue di IMZERS…ato tanya sama master master di fb (forum balikita)
Langkah berikutnya adalah memasukkan file yang di bungkus dengan linker ke dalam
profile… Sebaiknya box CSS loe yang ada di profile dikosongkan saja…
Hal ini dilakukan untuk menghindari bentrok antar code…
Sudah jelas blom??… Masukkan file yang sudah degenerate bersama linker di
MEDIA BOX section.
Save kemudian liat profile kamu…
CONGRATULATION
Kita sudah selesai melakukan TWEAKING PROFILE FRIENDSTER menggunakan
CSS… Masih banyak lagi yang harus dilakukan untuk TWEAKING…
Kalo liat profile gue… Itu masih ada Variasi JAVASCRIPT…
Nah… Tutorial tentang JAVASCRIPT gue sambung di edisi berikutnya yach...cape banget gue nech!!…
Gue harap kalian bisa sabar untuk terus dan terus belajar… Jangan pantang menyerah…
Ngga ada Noda yaCh Ngga Belajar ( iklan rinso...hehehe)
Berani untuk mencoba-coba script yang ada (trial and error boz)…
Jangan ragu untuk bertanya…
Akhir kata… Cukup sekian kompilasi gue tentang TWEAKING friendster bagian pertama ini…
Kalo me gak sibuk, akan saya lanjutkan ke tweaking bagian 2 dan seterusnya.
Udahhh achh,,,cape nich!!
