IndraDiky dot Com

UPDATE (21 Oktober 2005)
Barusan gue liat profil gue, dan ternyata berantakan kalo dibuka pake Internet Explorer. Terus yang bikin bete, FS udah ngeblok gambar2 yang ngehiasin kolom judul (More about xxx, xxx Testimonials) Terakhir geu liat profil gue 2 minggu yang lalu sih masih muncul gambarnya, termasuk logo nama gue yang gue taruh di tengah2 atas. Tapi sekarang semuanya gak ada. BETE.
—————————————————–

Karena masih banyak yang nanya en masih kesusahan juga ngeubah tampilan profilnya, gue mo posting lagi nih tentang cara ngeubah tampilan profil.

(FOR DUMMIES)

Kalo Bahasa Inggris lo payah, siapin kamus Bahasa Inggris, kalo bagus langsung kunjungin http://www.cubancouncil.com/friendster/index.html Terus, PILIH-PILIH WARNA yang lo mau, terus klik GENERATE FRIENDSTER CODE yang ada di bagian paling bawah. Ntar bakal muncul kodenya, nah lo tinggal HIGHLIGHT seluruh kodenya, abis itu klik kanan, pilih copy, terus buka FS lo klik edit profile, klik customize, terus cari tulisan Advanced users: Personalize your profile with CSS, kalo udah ketemu klik kanan di kotak di bawah tulisan tadi terus pilih paste. Terakhir klik save.

(FOR NORMAL USERS)

Kalo Bahasa Inggris lo payah, siapin kamus Bahasa Inggris. Kalo Bahasa Inggris lo lumayan bagus langsung kunjungin http://www.cubancouncil.com/friendster/index.html bis itu tinggal pilih2 warna, klik Generate Friendster Code terus paste kodenya ke menu Customize di FS lo.

(FOR ADVANCE USERS)

Nih gue kasih kode CSS gue, bisa diliat di bawah atau download di sini, lo tinggal edit2 aja ukuran hurufnya, ganti urlnya ama desain gambar lo. Lokasi URL udah gue tebelin supaya gampang ngeditnya.

————————————–

#logo img {url(http://i22.photobucket.com/albums/b347/indradk/banner2.jpg) fixed repeat;

}

body {

margin : 0px;

padding : 0;

background : #000066 url(http://url ke foto sendiri.gif) fixed repeat;

}

.left_column_about

{ margin: 10px 0 0 10px; color: #FFFFFF; }

.left_column_about .q

{ font-size: 11px; font-weight: bold; color: #DBCB5E;}

.left_column_about p

{ margin:0 0 7px 0; }

a:link, a:visited, a:active {

text-decoration:none;

}

a:link, a:visited, a:active {

color:#87abef;

}

a:hover {

color:#DBCB5E; text-decoration:none;

}

/* Your are viewing your own profile text */

.breadcrumbs {

width: auto;

height:18px;

font-size: 12px;

color: #424d61;

margin: 0 0 3px 0;

text-align: left;

position: relative;

}

.breadcrumbs a, .breadcrumbs a:visited {

text-decoration: none;

color: #424d61;

border-bottom: #424d61 solid 1px;

}

.breadcrumbs a:hover {

text-decoration: none;

color: #ff8a00;

border-bottom: #ff8a00 solid 1px;

}

/* view blog, view photo, view profile area */

.column_profile_nav {

border: 1px solid #638fd1;

background-color: #000066;

padding: 0 0px 0 0px;

margin: 0px 20px 10px 0px;

width: auto;

}

/* Yourname area */

.left_column_header {

width: auto;

height: 20px;

background-color: #0a1424;

border-color: #638fd1;

border-width: 1px;

margin:0px 0px 0px 0px;

}

/* header of more about Indra Diky & testimonial */

.left_column_header2 {

width: auto;

height: 25px;

border-top: solid 1px #638fd1;

border-right: solid 1px #638fd1;

border-bottom: none;

border-left: solid 1px #638fd1;

background-color: #0a1424;

background-image: url(http://url ke foto sendiri.gif);

margin: 10px 0px 0px 0px;

}

.left_column_header h1 {

height: auto;

background-color: red;

font-size: 12px;

font-weight: bold;

color: yellow;

padding: 1px 0px 0px 3px;

}

/* Text of More about Indra Diky */

.left_column_header2 h1 {

height: auto;

font-size: 14px;

line-height: 14px;

font-weight: bold;

font-family: verdana;

color: #DBCB5E;

margin: 3px 0px 0px 5px;

}

/* the BIG name Indra Diky */

.left_column_header h2 {

font-size: 18px !important;

font-weight: bold;

color: orange;

margin: 4px 0 0 0;

border-bottom: 1px solid #87abef;

}

.left_column_header h1 a:hover,

.left_column_header2 h1 a:hover {

color: yellow;

text-decoration:underline;

}

/* more about Indra Diky and testimonial content */

.left_column_wrapper {

width:auto;

height:auto;

margin: 0px 0px 3px 0px;

padding: 0px;

background-color: #000066;

border: 0;

border-top:0;

overflow: hidden;

font-size:12px;

color: #FFFFFF;

display: block;

}

.left_column_content {

width:auto;

height:auto;

margin: 0px;

padding: 8px 3px 0px 0px;

background-color: #000066;

border: #638fd1 solid 1px;

overflow: hidden;

font-size:12px;

color: white;

display: block;

}

/* Profile background color */

.left_column_wrapper .left_column_content {

background-color: #0a1424;

}

/* Indra Diky friends content */

.right_column .column_content {

width:300px;

height:auto;

margin: 0 0 9px 0;

background-color: #0a1424;

border: #638fd1 solid 1px;

border-top:0;

overflow: hidden;

font-size:12px;

color: #FFFFFF;

display: block;

}

/* 99 times since date */

.left_column_info

{ width: 100%; float: left; margin:4px 0 8px 0; color: #ffffff; font-size: 12px; font-weight: normal; }

/* Profile Viewed, location, hometown */

.left_column_info .q

{ font-size: 12px; font-weight: bold; color: #DBCB5E; }

/* Indra Diky’s friends header bg */

.right_column .column_header {

width: 302px;

height: 25px;

background-image: url(http://url ke foto sendiri.gif);

border: none;

}

/* Indra Diky’s friends header text */

.right_column .column_header h1 {

font-size: 14px;

font-weight: bold;

color: #DBCB5E;

margin: 0;

padding: 4px 0 0 6px;

}

/* Main Photo border */

.left_column_profile_mainphoto img {

border: 1px solid #638fd1;

}

.left_column_profile_thumbnails {

height:70px;

margin: 0 0 8px 0;

float: left;

text-align: left;

font-size: 10px;

color: red;

}

/* Thumbnail of photos */

.left_column_profile_thumbnails .photothumb {

width:50px;

height:50px;

overflow: hidden;

border: 1px solid #638fd1;

margin: 10px 6px 5px 9px;

float: left;

text-align: center;

}

/* Links color in profile */

.left_column_info a, .left_column_info a:visited

{ text-decoration: none; color: #87ABEF; border: 0; border-bottom: #87ABEF dotted 1px;}

.left_column_info a:hover

{ text-decoration: none; color: #DBCB5E; border: 0; border-bottom: #DBCB5E solid 1px;}

.left_column_testimonials a, .left_column_testimonials a:visited,

.left_column_about a, .left_column_about a:visited

{ text-decoration: none; color: #87ABEF; border: 0; border-bottom: #87ABEF dotted 1px;}

.left_column_testimonials a:hover, .left_column_about a:hover

{ text-decoration: none; color: #DBCB5E; border: 0; border-bottom: #DBCB5E solid 1px;}

/* Bullet */

.buttondiv_new ul li {

color: #49556B;

width: 110px;

float: left;

margin: 0px 0px 0px 9px;

padding: 0 0 0 8px;

background: url(/images/or_bullet.gif) no-repeat center left;

list-style: none;

}

/* view blog, view photo, view profile… links color */

.buttondiv_new a:link, .buttondiv_new a, .buttondiv_new a:visited {

text-decoration: none;

color: #87ABEF;

border-bottom: #87ABEF dotted 1px;

}

.buttondiv_new a:hover {

text-decoration: none;

color: #DBCB5E;

border-bottom: #DBCB5E solid 1px;

}

/* Sponser */

.left_column_sponsoredlinks_frame

{ width:550px; height:100px; background: #0a1424; border: #aeaeae solid 1px; float: left; margin: 0 0 10px 0; display: block; }

/* Friends area */

.friendsof

{ text-align: center; font-size: 11px; color: #FFFF; padding: 0 0 10px 0; margin: 0 auto; }

.friends

{ width: 77px; height: auto; margin: 10px 9px 0px 9px; display: block; float: left; }

.see_all_friends { width:280px; clear: both; border-top: 1px solid #638fd1; text-align: center; margin: 0 10px 5px 10px; padding: 5px 0; }

.see_all_friends a, .see_all_friends a:visited

{ text-decoration: none; color: #87ABEF; border-bottom: #87ABEF dotted 1px; font-weight: bold; }

.see_all_friends a:hover

{ text-decoration: none; color: #DBCB5E; border-bottom: #DBCB5E solid 1px; }

.seeall { font-weight: bold; width: 310px; text-align: center; padding: 5px 0; clear:both; margin: 0 0 5px 0; }

.seeall a, .seeall a:visited, .see_all a, .see_all a:visited

{ text-decoration: none; color: #87ABEF; border-bottom: #87ABEF dotted 1px; }

.seeall a:hover, .see_all a:hover

{ text-decoration: none; color: #DBCB5E; border-bottom: #DBCB5E solid 1px; }

/* Friends photo border */

.friendsphoto

{ width: 75px; height: 75px; border: #DBCB5E solid 1px;overflow: hidden; text-align:center; }

/* Friends name links */

.friends .name a, .friends .name a:visited {font-weight:normal; color:#87ABEF;}

.friends .name a:hover {font-weight:normal; color:#DBCB5E;}

/* Testimonial photo border */

.left_column_testimonials .photo

{ width:50px; height:50px; border: #DBCB5E solid 1px; margin: 0px 18px 0px 0px; float: left; text-align: center; overflow: hidden; }

/* Testimonial date */

.left_column_testimonials_content .date

{ font-size: 10px; font-weight: bold; color: #DBCB5E; margin: 0 0 5px 0; }

/* Testimonial photo size */

.left_column_testimonials img

{ height:100px; border: 0; margin: 0; }

.left_column_testimonials .photo

{ width:100px; height:100px; border: #aeaeae solid 1px; margin: 0px 18px 0px 0px; float: left; text-align: center; overflow: hidden; }

.right_column_groups

{ width:280px; margin: 10px 0 0 10px; padding-bottom: 10px; border-bottom: #aeaeae solid 1px; display: block; }

/* right column group text */

.right_column_groups_content

{ width:210px; height:auto; margin: 0; float: left; font-size: 12px; color: #FFFFFF;}

.right_column_groups_content .date

{ font-size: 10px; font-weight: bold; color:#DBCB5E; margin-top: 10px; }

.right_column_groups_content p

{ margin: 0 0 12px 0; }

/* teaser box stuff (top list) */

#teaserBox { width: 300px; border: solid 1px #638fd1;}

#teaserBox div { background-color: #000066; }

#teaserBox h2 { font-size: 12px !important; font-weight: bold; color: #DBCB5E; padding: 1px 0px 0px 5px; margin: 0; background-color: #000066; }

#teaserBox ol li {font-size:12px; margin-top: 5px;}

#teaserBox div div { border: none; }

.commonbox {

width: 300px;

border: solid 1px #638fd1;

padding: 0;

margin: 0 0 9px 0;

}

.boxcontent {

padding: 5px 5px;

font-size: 12px;

margin: 0;

background-color: #000066;

color: #FFFFFF;

}

.commonbox h2 {

height: 25px;

font-size: 12px !important;

font-weight: bold;

color: #DBCB5E;

padding: 0px 0px 0px 5px;

margin: 0;

background-image: url(http://url ke foto sendiri.gif);;

}

.right_column_title

{ width:302px; height:25px; background-image: url(http://url ke foto sendiri.gif); margin:0; border: none;}

.right_column_title h1

{ font-size: 14px; font-weight: bold; color: #DBCB5E; margin: 0; padding: 4px 0 0 6px;}

/* Indra Diky group background */

.right_column_content

{ width:300px; height:auto; background-color: #000066; border: #638fd1 solid 1px; border-top:0; overflow: hidden; font-size:12px; color: #FFFFFF !important; padding: 10px 0 0 0; margin: 0 0 10px 0; }

/* Header */

#navigation { width: 100%; height: 111px; background-image: url(http://i22.photobucket.com/albums/b347/indradk/banner2.jpg);}

#logo { height: 60px; float: left; }

#logo {display: none;}

#logo img { margin: 15px 0 0 0; }

#subnav { width: 300px; display: block; font-size: 12px; float: right; color: #DBCB5E; margin: 35px 0 0 0; }

#subnav a, a:visited { color: #DBCB5E; font-weight: bold; text-decoration: none; }

#subnav a:hover { color: #DBCB5E; font-weight: bold; text-decoration: underline; }

#nav_bg { width: 100%; background-image: url(http://url ke foto sendiri.gif); height: 26px; margin-top: 0; margin-left:0; overflow: hidden; }

#options { height: 24px; float: left; overflow: hidden; }

#options ul { margin: 0; padding: 3px 0 5px 0; }

#options ul li { display: inline; margin: 0 0 0 -4px; padding: 0 0 0 -2px; font-size: 12px; font-weight: bold; color: #fff; }

#options ul li.firstli { border: 0; margin: 0 0 0 4px; }

#options ul li a, #options ul li a:link, #options ul li a:visited, #options ul li a:active { color: #DBCB5E; text-decoration: none; font-weight: bold; padding: 5px 7px 5px 7px; border: none; }

#options ul li a:hover {background: none; color: orange; text-decoration: none; font-weight: bold; }

#search { width: 300px; float: right; padding: 0 0 0 0; font-size: 12px; color: #fff; }

#search form { color: #fff; }

#marketing { width: 80%; float: left; text-align: center; font-weight: normal; font-size: 12px; color: #638fd1; padding: 2px 0 0 0; }

#marketing_bg { width: 100%; background: #000066; height: 27px; margin: -18px 0 0 0; border-bottom: 1px solid #638fd1; border-right: 1px solid #638fd1; border-left: 1px solid #638fd1;}

#marketing a:link, #marketing a:visited, #marketing a:active { color: #666; text-decoration: underline; }

#marketing a:hover { color: #ff8a00; text-decoration: underline; }

written by Indra Diky