Keberadaan Friendster di dunia virtual sudah tidak diragukan lagi. Friendster memiliki lebih dari 14 juta member dan terus bertambah setiap harinya. Cukup banyak manfaat yang bisa kita dapatkan dengan menjadi member Friendster, yang paling nyata adalah kita dapat berkomunikasi lagi dengan teman-teman lama kita. Satu hal yang sering dibicarakan mengenai Friendster adalah profile account. Tampilan Friendster yang memukau menjadi keinginan setiap pemilik account Friendster. Apa saja yang bisa kita lakukan untuk menjadikan profile Friendster kita terlihat lebih cantik dan menarik?
Sangat mudah untuk mempercantik tampilan profile friendster kamu. Untuk memodifikasi tampilan FS kamu, kita menggunakan CSS. CSS merupakan kependekan dari Cascading Style Sheet. CSS adalah kode yang digunakan untuk memodifikasi sebuah halaman HTML. Pada tahun 1996 World Wide Web Consortium (W3C) menemukan CSS. Kamu dapat meletakkan CSS di dalam panel box CSS melalui menu edit profile - costumize.
Kita membagi profile friendster menjadi 14 bagian, yaitu page background, global font, global link, master boxes, master headers, control panel : box, control panel : user photo, control panel : data, control panel : about me link, control panel : button, testimonials or review text, view all links, small photo, and small photo names.
| 01. Page Background |
| body { background-image : url(http://www.friendster-istuff.110mb.com/bg/spiderman.png); background-attachment : fixed; background-position : center center; background-repeat : no-repeat; background-color : #000000; cursor: url("http://www.friendster-istuff.110mb.com/cursor/heart.ani"), default;} |
| :: Kode CSS di atas digunakan untuk mengubah background profile :: Line 2 Merupakan alamat URL gambar yang ingin kamu jadikan background. Line 3 Maksud kata "fixed" adalah background tetap pada posisinya. Tidak berubah ketika melakukan scrolling. Line 4 Menunjukkan posisi background tepat di tengah secara horizontal maupun vertikal. Line 5 Menyambung kata "fixed" berarti tidak ada perulangan background. Line 6 Adalah warna dasar background (#000000 : hitam). Jika URL background kamu hilang (pindah) atau tidak tersedia maka background kamu akan hitam solid. Kamu juga dapat mengganti dengan warna yang lain (gunakan bahasa Inggris)seperti yellow, white, dan lain-lain. Line 7 Untuk cursor. Jika URL cursor hilang (pindah) atau tidak tersedia maka akan menjadi cursor default. Cursor default dapat kamu ganti dengan crosshair, move, help, dan lain-lain. |
| 02. Global Font |
| .usercontent { font-family : Courier New, Courier, Monaco, monospace; color : #ffffff; } |
| :: No 02 adalah CSS untuk mengatur huruf di profile kamu ::Line 2 Adalah jenis huruf default yang digunakan. Kamu dapat menggantinya dengan c0mic sanS ms, dan lain-lain... Line 3 Sedangkan baris ke-3 untuk menentukan warna huruf (#ffffff : putih). Kamu dapat menggantinya dengan warna lain! |
| 03. Global Link |
| .usercontent a, .usercontent a:link, .usercontent a:visited, .usercontent a:hover, .usercontent a:active { color : #ff0000; } .usercontent a : hover { text-decoration : none; color : #ffffff; } |
| :: CSS untuk link Line 5 "text-decoration" dapat kamu ganti dengan underLine, underline overline, line-through Line 6 Kamu juga dapat membuat sebuah link yang atraktif seperti mengubah warna background, warna huruf, ukuran huruf, dan lain-lainnya ketika cursor menyentuh link! |
Contoh CSS atraktif link :
.user content a : hover {
font-size : 12px;
color : white;
font-family : Verdana,tahoma;
text-decoration : line-through;
background-color : blue;
}
.user content a {
font-size : 10px;
color : red;
font-family : Verdana,tahoma;
text-decoration : none;
background-color : yellow;
}
| No. 04 - 14 |
| Pada dasarnya No 04 - 14 sama seperti diatas, kita dapat melakukan perubahan pada warna, jenis huruf, ukuran huruf, dan lain-lainnya. Hanya saja pada No 04 - 14 ini kita lebih cenderung kepada modifikasi tabel, seperti background tabel dan border tabel. .commonbox { background-color : yellow; border-right : 1px black solid; border-bottom : 2px green solid; border-top : 3px red solid; border-left : 4px blue solid; border-bottom-style: dashed; font-family : simplex, comic sans ms; color : green; font-weight : bold; font-size : 11px; }Hasil code di atas :
|
| 04. Master Boxes |
| .commonbox { background-color : transparent; } .commonbox .evenrow { background-color : transparent; } |
| 05. Master Headers |
| .commonbox h1, .commonbox h2 { font-family : Courier New, Courier, Monaco, monospace; color : #ff0000; background-color : transparent; } |
| 06. Control Panel : Box |
| .controlpanel { background-color : transparent; } |
| 07. Control Panel : User Photo |
| .controlpanel .imgblock200 { border-color : transparent; } |
| 08. Control Panel : Data |
| .controlpanel .q { font-family : Courier New, Courier, Monaco, monospace; color: #ffffff; } .controlpanel .data { font-family : Courier New, Courier, Monaco, monospace; color: #ff0000; } .data a { font-family : Courier New, Courier, Monaco, monospace; color: #ff0000; } |
| 09. Control Panel : About Me Link |
| a.more { font-family : Courier New, Courier, Monaco, monospace; color: #ff0000; } |
| 10. Control Panel : Button |
| #controlPanelButtons a, #controlPanelButtons a:link, #controlPanelButtons a:visited { font-family : Courier New, Courier, Monaco, monospace; color : #ff0000; border-color : #ff0000; border-style : dashed; background-color : transparent; } #controlPanelButtons a:hover { font-family : Courier New, Courier, Monaco, monospace; color : #000000; border-color : #ffffff; background-color : #ff0000; text-decoration : line-through; } |
| 11. Testimonials or Reviews Text |
| .data { font-family : Courier New, Courier, Monaco, monospace; color : #ffffff; } |
| 12. View All Links |
| .commonbox .viewall { font-family : Courier New, Courier, Monaco, monospace; color : #ff0000; } |
| 13. Small Photos |
| .commonbox .imgblock75, .ir { border-width : 5px; border-color : #ff0000; border-style : dotted; background-color : transparent; } |
| 14. Small Photo Names |
| .commonbox .dr { font-family : Courier New, Courier, Monaco, monospace; color : #ffffff; background-color : transparent; } |
Nah, aku ada web "lucu" nih buat kamu yang suka utak-atik friendster :
www.friendster-istuff.tk
3 komentar:
misi mas atwpun mbk ni,,hbsnya aq gk tau hars manggil ap???
mhon maaaph bgt,,
btw,,aq mw nanya mw nanya seputar friendster ni mas/mb,,
1. kok kursornya g keganti,,,aq dah ke situs yang dibilang jg tapi g berhasil jg,,,trz aq musti gmn???kirim ke email dunk mas/mb,,
"girl_on_not@yahoo.com"
2. di fs bs buat icon online atw gk gtyu ya mas/mb,,biar teman2q pada tau misalnya kalo aq lg online gt,,,trz caranya gmn?????
makasih atas bantuan jawabannya ya,,,ditunggu diemailku,,
coy....
gimana si caranya bwat efek snow(salju
di blogger ????
keren brow...
kirimin ya ke fs aq
add jga
di
"bayu_s7755@yahoo.co.id"
Ka mO naNya Ne, ka jenis2 FoNt sTyle bUat FS Pa Aja, cOZ Aku PErNah NyOba PaKEin huRuf "DaRk CrysTal" tApi Gag BisA DimUAT, yaNG jaDi cuMA Comic, TNR, dll yang agAg bOSen Liatnya....
N atu lagi ka, ka tahu Jenis2 BorDer StYle seLAin solid, dotted, and double???
ThaNks
Posting Komentar