jump to navigation

trik menarik menghias friendster

Friendster sekarang tambah asik karena bisa utak-atik profile dengan CSS. Ada dua macam pilihan untuk mengutak-atik profil kita. Pertama untuk nubi alias beginners dan kedua untuk advanced users. Untuk nubi cuma bisa ganti-ganti warna doang sedangkan untuk advanced users bisa ganti semuanya: background untuk masing-masing box, warna, font, dan lain-lain. Supaya tidak terkesan nubi dalam mengutak-atik profil kita maka simak tutorial berikut ini.

then3xt_community

gue-adjahUntuk memulai utak-atik login ke account anda dan pilih menu “Edit Profile“. Setelah itu pilih menu “Customize“. Disitu ada 3 buah box. Yang pertama adalah untuk menambahkan media pada profil kita, kedua untuk mengubah profile secara manual dengan CSS, dan yang paling bawah adalah mengubah profil untuk beginner. Klik box yang kedua untuk memulai.

Pertama-tama kita akan mengganti font yang digunakan untuk menampilkan tulisan. Tambahkan line berikut di box kedua:

body {
font-family: Trebuchet MS, sans-serif;
font-size: 14px;
}

Selanjutnya kita akan mengubah tampilan box “About Me” pada halaman profil kita dengan menambahkan background image yang khusus. Pilihlah gambar latar yang netral. Artinya warnanya tidak banyak dan terkesan monoton. Tujuanya adalah agar tulisan di dalam box tersebut dapat dibaca. Setelah anda memilih gambar yang pas, upload ke ImageShack dan simpan url yang paling bawah. Ini adalah url ke image yang sudah anda upload. Kemudian tambah line berikut ini ke box di halam edit profile tadi

.left_column_wrapper .left_column_content {
background-image: url(http://url
.ke.image.yang.dari.imageshack);
background-repeat: no-repeat;
background-position: right bottom;
}

#mainimage {
border: 1px dashed #e9ffbb;

}

URL nya ganti dengan URL yang dari imageshack tadi. Untuk positionnya sesuaikan dengan orientasi gambar anda. Jika anda menginginkan orintasi dari atas dan kiri maka ganti menjadi left top. Kode #mainimage fungsinya agar foto kita di beri frame yang putus-putus. Setelah anda save maka coba lihat hasilnya. Tadaaa. Profil anda menjadi lucu🙂

Supaya terlihat lebih keren dan beda dari yang lain, anda bisa mengubah font pada box “About Me” tadi dengan menggunakan small-caps alias huruf kapital semua. Caranya adalah demikian

#caption, .left_column_info {
font-variant: small-caps;
text-decoration: none;
color: #e9ffbb;
}

Sekarang kita akan memberi sentuhan yang berbeda pada box “More About Me”. Pilih gambar yang lain lagi dan ulangi langkah untuk mengupload gambar ke imageshack. Setelah itu tambahkan line berikut

.left_column_about {
background-image: url(http://url.ke.image.yang.dari.imageshack);
background-repeat: no-repeat;
background-position: right bottom;
}

Untuk mengubah warna font dan warna latar header pada masing-masing box gunakan kode ini

.left_column_header2, .left_column_content,
.right_column .column_content,
#teaserBox {

border-color: #015811;
}

.left_column_header2, .right_column .column_header,
#teaserBox h2{
background-color: #216800;
border-bottom: none;

}

.left_column_header2 h1, .right_column .column_header h1,#teaserBox h2{
color: #e9ffbb;
font-varian

t: small-caps;
}

Itu adalah beberapa trik untuk mengutak-atik profil friendster. Selanjutnya anda bisa coba-coba sendiri.

ALTERNATIF KLIK DISINI.

DAPATKAN CURSOR MENARIK UNTUK FS ANDA DISINI

Jika ada pertanyaan silahkan dilontarkan.

Selamat mengutak-atik dan good luck!

Komentar»

1. mirc-kalsel - Juli 15, 2008

mas artikelnya ta kopas ke tempat q ya,buat tambah2 koleksi.maap ta ambil dulu baru ngomong minta heheh….
artikelnya bagus membantu….

2. ningsih - Agustus 7, 2008

mas cara buat kursor mania gman……….
dtunggu ya mas

3. nandi - September 26, 2008

bagus tapi aku ga ngerti sama sekali

4. dhizy - Oktober 3, 2008

aq bgg mas,,
njelasinnya yg enak dund
hehehe

5. sadf - Desember 20, 2008
6. Friendstertrik - Desember 21, 2008

bagus nie triknya,saling berbagi dan memberi yuks……

7. hamba allah - Desember 24, 2008

hebattttt tapi aku gak ngerti pakek bahasa yang mudah dicerna dan di pahami dunk….mumet aku… tapi hebat walo aku lom coba …. heheeeeee

8. agi - Januari 18, 2009

mas gimanasih caranya ngasih aniimasi dibawah halaman biar gerak gitu….
buat tampilan pop up

9. razzi - Januari 21, 2009

bingung aku..??

10. aditya - Februari 23, 2009

hehehehehe….hohohooh..

11. PESELANCAR FS - Februari 28, 2009

MAS /PA’DE DIDLM TUTORIAL GANTI IMG BOX KATANYA ADA 3 BOX…
KOK FS Q CUMA 2..
1. BOX CSS EDITOR
2. BOX MEDIA , yg
3. ?????????????

12. PESELANCAR FS - Februari 28, 2009

oh ya mas satu pertanyaan lg ne… ada tips untuk modifikasi baner FS dg gbr yg kita mau ga? klo ada tlg dibagi ilmunya🙂 tnx’..

13. Rama - Maret 15, 2009

Triknya boleh juga dilaksanakan…..

14. Frima - Maret 15, 2009

Keren juga, tapi dimana yah yg nyediain layout gratis yg terupdate

15. jhonie - Mei 1, 2009

kok beda ya? pa friendster dah ganti formatnya?

16. reztoefara - Mei 9, 2009

mari terus berbagi trik bro…………………


Tinggalkan Balasan

Isikan data di bawah atau klik salah satu ikon untuk log in:

Logo WordPress.com

You are commenting using your WordPress.com account. Logout / Ubah )

Gambar Twitter

You are commenting using your Twitter account. Logout / Ubah )

Foto Facebook

You are commenting using your Facebook account. Logout / Ubah )

Foto Google+

You are commenting using your Google+ account. Logout / Ubah )

Connecting to %s

%d blogger menyukai ini: