friendsterTalk - Friendster Forum

friendsterTalk - Friendster Forum

Welcome guest! Please Login or Register.

#1  2007-03-31 12:48:18

Ephemeral
» Moderator
Ephemeral's display avatar
The Forbidden
Class-S
Location: Lucena City PH
Registered: 2006-10-20
Posts: 9310
Last visit: 2008-08-27
Reputation: 217
Friendster

CSS Base For Friendster Blogs.

I know some of us are more into blogs that too there main profile, so here's a trick :)

This is the CSS that makes the CSS of Friendster Blogs.

Code:

/* friendster banner */

.friendster-banner
{
    position: relative;
    width: 100%;
    margin: 0;
    border-bottom: 1px solid #546172;
    padding: 0;
    background: #d5d5d5;
    text-align: center;
}

.friendster-banner-nav-wrapper
{
    background: #e33800 url(URL OF BANNER') repeat-x;; padding-left:0; padding-right:0; padding-top:10px; padding-bottom:10px
}

.friendster-banner-nav
{
    position: static;
    overflow: hidden;
    width: 780px;
    margin: 0 auto;
    text-align: left;
}

.friendster-banner-nav-logo
{
    float: left;
    display: inline;
}

.friendster-banner-nav-links
{
    float: right;
    display: inline;
    color: #fff;
    font-family: arial, helvetica, sans-serif;
}

.friendster-banner-nav-links a:link,
.friendster-banner-nav-links a:hover,
.friendster-banner-nav-links a:active,
.friendster-banner-nav-links a:visited
{
    color: #fff;
}

.friendster-banner-nav-links a:hover,
.friendster-banner-nav-links a:active
{
    text-decoration: underline;
}

.friendster-banner-ad-wrapper
{
    padding: 10px 0;
}

.friendster-banner-ad
{
    position: static;
    overflow: hidden;
    width: 728px;
    margin: 0 auto;
    text-align: center;
}


/* friendster footer */

.friendster-footer
{
    position: relative;
    width: 100%;
    margin: 0;
    padding: 10px 0;
    text-align: center;
}

.friendster-footer-ad
{
    position: static;
    overflow: hidden;
    width: 728px;
    height: 90px;
    margin: 0 auto;
    text-align: left;
    background: #eee;
}

.friendster-footer-nav
{
    width: 728px;
    margin: 10px auto 0;
    font-family: arial, helvetica, sans-serif;
    font-size: 10px;
    text-align: center;
}


/* friendster body ad */

.friendster-body-ad
{
    margin-bottom: 40px;
    text-align: center;
}


/* link banner */

.link-banner
{
    position: relative;
    width: 100%;
    margin: 0;
    border-bottom: 1px solid #ccc;
    background: #fff;
    font-family: helvetica, arial, 'trebuchet ms', sans-serif;
    font-size: 11px;
    text-align: center;
}

.link-banner-inner
{
    display: block;
    position: static;
    width: 672px;
    margin: 0 auto;
    padding: 5px 0;
    text-align: left;
}

.link-banner a, .link-banner a:visited
{
    text-decoration: underline;
    color: #333;
    margin-right: 15px;
}

.link-banner a:hover
{
    text-decoration: underline;
    color: #546172;
}


/* comment form */

#friendster-comment-login { display: block; }
#friendster-comment-form { display: none; }

You can use the CSS extension trick on this on a diffrent way.

Go to you "Blog Home"

Click "Edit Configuration"

Paste this code below on "Blog description/catchphrase:"

Code:

<link rel="stylesheet" type="text/css" href="URL OF CSS HERE ">

Change the URL OF CSS HERE on the code with your uploaded CSS file.

Use the CSS codes above mentioned to alter the CSS :)

Try these CSS ad-ons :)

Code:

/* Remove Top Ads */ 

.friendster-banner-ad-wrapper { width: 780px; height: 132px; display: none; }
.friendster-banner-ad { display: none; }

/* Remove Footer Ads*/
.friendster-footer { width: 780px; height: 132px; display: none; }

/*  Remove Body Ads*/ 
.friendster-body-ad { width: 780px; height: 132px; display: none; }

Try understanding who to edit the properties of a particular div/CSS code

go to http://www.w3schools.com  :eh:

Added

Code:

/* Original fresh CSS from friendster.com */
/* CSS modified by S|aSher-X http://www.friendster.com/eksss */
/* i have a feeling that these comments will probably not be here for long */
/* enjoy pimping! :D */

/* -- scrollbar colors -- */
html, body {
scrollbar-face-color: #727E7E;
scrollbar-shadow-color: #262727;
scrollbar-highlight-color: #727E7E;
scrollbar-3dlight-color: #454E4D;
scrollbar-darkshadow-color: transparent;
scrollbar-track-color: #454E4D;
scrollbar-arrow-color: transparent;
scrollbar-base-color: #454E4D;
}

/* -- bgcolor of the blog -- */
body
{
min-width: 780px;
color: #ccc;
background: #252525;
}
/* -------------------------------------------------------------------------------- */

/* -- banner behind the photo and blog title -- */
#banner
{
width: 760px; /* necessary for ie win */
background: #600 url(http://i67.photobucket.com/albums/h316/slasherx12/transparent-bg_X.gif) repeat-x;
background-color: transparent;
}
/* -------------------------------------------------------------------------------- */

/* -- repeating background image of the body -- */
#container
{
width: 780px;
background: url(http://i138.photobucket.com/albums/q279/jsesbreno/ContainerBG-1.jpg) repeat-y;
}
/* -------------------------------------------------------------------------------- */

/* -- bgcolor behind the topheader .. and i also use this to center my topheader on both IE and Mozilla -- */
.friendster-banner
{
position: relative;
/*width: 780px;
height: 156px;*/
width:100%;
margin: 0;
border-bottom: 0px solid #546172;
padding: 0;
background: #252525;
text-align: center;
}
/* -------------------------------------------------------------------------------- */

/* -- my topheader -- */
.friendster-banner-nav-wrapper
{
width: 780px;
height: 132px;
background: url(http://img.photobucket.com/albums/v674/EphimeralKaizer/ItachiHeader.jpg);
}
/* -------------------------------------------------------------------------------- */

/* -- dont know what this is .. i think its the position of my topheader :) -- */
.friendster-banner-nav
{
position: static;
overflow: hidden;
width: 780px;
margin: 0 auto;
text-align: left;
}
/* -------------------------------------------------------------------------------- */

/* -- friendster logo (i think) :D -- */
.friendster-banner-nav-logo
{
display: none;
}
/* -------------------------------------------------------------------------------- */

/* -- Home | Blogs links -- */
.friendster-banner-nav-links
{
float: right;
display: inline;
color: #393f3f;
font-family: arial, helvetica, sans-serif;
padding-right: 20px;
padding-bottom: 5px;
font-weight: bold;
text-decoration: none !important;
}
/* -------------------------------------------------------------------------------- */

/* -- says pretty much everything on the Home | Blogs section only! -- */
.friendster-banner-nav-links a:link,
.friendster-banner-nav-links a:hover,
.friendster-banner-nav-links a:active,
.friendster-banner-nav-links a:visited
{
color: #393f3f;
text-decoration: none !important;
}
/* -------------------------------------------------------------------------------- */

/* -- top ads -- */
.friendster-banner-ad-wrapper
{
width: 780px;
height: 132px;
display: none;
}
/* -------------------------------------------------------------------------------- */

/* -- top ads -- */
.friendster-banner-ad
{
display: none;
}
/* -------------------------------------------------------------------------------- */

/* friendster footer (ads) */
.friendster-footer
{
width: 780px;
height: 132px;
display: none;
}
/* -------------------------------------------------------------------------------- */

/* -- body ads -- */
.friendster-body-ad
{
width: 780px;
height: 132px;
display: none;
}
/* -------------------------------------------------------------------------------- */

/* -- module header or the little rectangular boxes with links (not all) on the right side of my blog -- */
.module-header,
.trackbacks-header,
.comments-header,
.comments-open-header,
.archive-header
{
/* ie win (5, 5.5, 6) bugfix */
p\osition: relative; 
width: 100%;
w\idth: auto;


margin: 0 0 1px 0;
padding: 5px 5px 5px 24px;
/*color: #f93;*/
color: #2b2e33;
background: #0f181f url(http://i138.photobucket.com/albums/q279/jsesbreno/Headers.gif) 0 50% no-repeat;
font-size: 11px;
font-weight: bold;
text-transform: uppercase;
}

.module-header a,
.trackbacks-header a,
.comments-header a,
.comments-open-header a,
.archive-header a
{
color: #2b2e33;
text-decoration: none;
}

.module-header a:visited,
.trackbacks-header a:visited,
.comments-header a:visited,
.comments-open-header a:visited,
.archive-header a:visited
{
color: #2b2e33;
}

.module-header a:hover,
.trackbacks-header a:hover,
.comments-header a:hover,
.comments-open-header a:hover,
.archive-header a:hover
{
color: #FFFFFF;
}
/* -------------------------------------------------------------------------------- */

/* -- user photo -- */
.banner-user
{
float: left;
overflow: hidden;
width: 64px;
margin: 0 15px 0 0;
border: 0;
padding: 0;
text-align: center;
}

.banner-user-photo
{
display:compact;
margin: 0 0 2px 0;
border: 0;
padding: 0;
background-position: center center;
background-repeat: no-repeat;
text-decoration: none !important;
}

.banner-user-photo img
{
width: 64px;
height: auto;
margin: 0;
border: 0;
padding: 0;
}
/* -------------------------------------------------------------------------------- */

/* -- title of your blog -- */
#banner
{
position: relative; /* ie 5 win */
p\osition: static; /* everything else */
}

#banner a { display:none; color: #fff; font-weight: bold; text-decoration: none; }
#banner a:visited { display:none; color: #fff; }
#banner a:hover { display:none; color: #989898; }
/* -------------------------------------------------------------------------------- */

/* -- i forgot what this is :S -- */
.module-powered .module-content
{
display: none;
margin: 0;
padding: 10px;
border: 1px solid #888899;
color: #fff;
background: #343f4a;
}
/* -------------------------------------------------------------------------------- */

/* Title of your Active Post  */
.entry-header
{
margin: 10px 0;
padding: 0;
color: #FFFFFF;
font-size: 18px;
font-weight: bold;
font-style: italic;
text-decoration: none !important;
}
/* -------------------------------------------------------------------------------- */

/* --h3 size (the title of the active post) -- */
h3 {
text-align: center;
}
/* -------------------------------------------------------------------------------- */

/* -- chars at the main body -- */
div.entry-body {
text-align: justify;
}
/* -------------------------------------------------------------------------------- */

/* -- haha forgot this too :) -- */
.module-content
{
position: relative;
margin: 0px 0px 0px 0px;
}
/* -------------------------------------------------------------------------------- */

/* -- color of the BODY of the lil rectangular boxes on my right side -- */
div.module-content {
background: transparent;
}
/* -------------------------------------------------------------------------------- */

/* -- bullet -- */
ul.module-list li
{
margin: 0px 0px 15px 0px; 
padding-left: 0px;
/*background: url(theme-beckett/li-bg.gif) 0 0.3em no-repeat;*/
background: transparent;
}
/* -------------------------------------------------------------------------------- */

/* -- colors of the links on the right of my blog -- */
.module-content a { color: #cccccc; font-weight: bold; }
.module-content a:visited { color: #cccccc; }
.module-content a:hover { color: #ffffff; }
/* -------------------------------------------------------------------------------- */

/* -- divider image -- */
#container-inner
{
margin: 0 10px 0 10px;
border-bottom: 1px solid #5b626a;
background: url(http://img220.imageshack.us/img220/2059/dividerbgxec1.gif) 297px 0 repeat-y;
}

The CSS idea's above are credited to Slasher-X of Markyctrigger

Last edited by Ephemeral (2008-03-12 07:22:50)


#2  2007-03-31 13:31:18

james_cuteoo2
» Moderator
james_cuteoo2's display avatar
ShawtyGetLoose:b
Singles Goes HOT!
Location: @hayden'sheart.
Registered: 2006-11-18
Posts: 7408
Last visit: Yesterday
Reputation: 78
Friendster

Re: CSS Base For Friendster Blogs.

^ thx for sharin this maybe i can use this
trick. ehehe! thx for sharing it. ehehe!



Heroes Season III: Villains -- 08/22/08
Our official signature for the month of: September.
Thanks for those people who greet me & gave me + reputation.

#3  2007-03-31 16:59:09

masterjin
» FriendsterAddict
masterjin's display avatar
Wit Is Educated Insolence
Location: Ireland
Registered: 2007-01-29
Posts: 440
Last visit: 2008-04-20
Reputation: 4
Friendster

Re: CSS Base For Friendster Blogs.

Thanks for sharing this bro.  =)

To view sample of what Ephemeral is talking about - CLICK HERE.

#4  2007-03-31 18:14:26

feruzz
» Retired Moderator
feruzz's display avatar
X-Mod
Class-S
Location: Malaysia
Registered: 2007-02-18
Posts: 8262
Reputation: 134
???

Re: CSS Base For Friendster Blogs.

thanks for sharing Ephe! =)  you deserve it as the best mods here :)

#5  2007-04-05 04:08:01

kunero
» FriendsterTalker
kunero's display avatar
Location: kanagawa japan
Registered: 2006-12-19
Posts: 104
Last visit: 2007-06-23
Reputation: ~
Friendster

Re: CSS Base For Friendster Blogs.

do anybody knows the code for cursor??


A mInd IS a TerRiBle tHinG tO WaStE!!!

#6  2007-04-05 05:05:57

feruzz
» Retired Moderator
feruzz's display avatar
X-Mod
Class-S
Location: Malaysia
Registered: 2007-02-18
Posts: 8262
Reputation: 134
???

Re: CSS Base For Friendster Blogs.

kunero wrote:

do anybody knows the code for cursor??

try this one...do not remove the <style> & </style>
put into Blog description/catchphrase:

Code:

<style>body {cursor: url(URL_OF_CURSOR);}a {cursor: url(URL_OF_CURSOR);}</style>

#7  2007-04-05 08:22:34

aisuke
» FriendsterAddict
aisuke's display avatar
~HaTeS cOpYcAtS sO mUcH..
Location: tOmOeDa CiTy.. ^_~
Registered: 2007-03-23
Posts: 327
Last visit: 2008-05-14
Reputation: -6
Friendster

Re: CSS Base For Friendster Blogs.

tnx
4
sharin'




~l::. No one steals my boyfriend!! .::l~

#8  2007-04-05 14:10:19

kunero
» FriendsterTalker
kunero's display avatar
Location: kanagawa japan
Registered: 2006-12-19
Posts: 104
Last visit: 2007-06-23
Reputation: ~
Friendster

Re: CSS Base For Friendster Blogs.

feruzz wrote:

kunero wrote:

do anybody knows the code for cursor??

try this one...do not remove the <style> & </style>
put into Blog description/catchphrase:

Code:

<style>body {cursor: url(URL_OF_CURSOR);}a {cursor: url(URL_OF_CURSOR);}</style>

thanx :D


A mInd IS a TerRiBle tHinG tO WaStE!!!

#9  2007-04-22 05:47:54

Ephemeral
» Moderator
Ephemeral's display avatar
The Forbidden
Class-S
Location: Lucena City PH
Registered: 2006-10-20
Posts: 9310
Last visit: 2008-08-27
Reputation: 217
Friendster

Re: CSS Base For Friendster Blogs.

:arrow: Topic Moved To Blog Section  :eh:


#10  2007-04-22 19:43:30

' 'eMokIdD
» Moderator
' 'eMokIdD's display avatar
[Disaster Masterpiece]
Class-S
Location: Y! Conference
Registered: 2007-03-10
Posts: 3279
Reputation: 82

Re: CSS Base For Friendster Blogs.

thanks for this

#11  2007-04-24 01:14:58

miss kita pag tuesday
» FriendsterWhiz
miss kita pag tuesday's display avatar
LH but sometimes its a GH
Location: incubator
Registered: 2006-12-18
Posts: 2779
Last visit: 2008-08-24
Reputation: 8
Friendster

Re: CSS Base For Friendster Blogs.

nice one ephe..astig ka :thumbsup:


Love Hurts but Sometimes its a good hurts

#12  2007-04-26 05:56:00

HelpMeGuys
» FriendsterNewbie
HelpMeGuys's display avatar
Location: Computer's Paradissse
Registered: 2007-04-12
Posts: 85
Last visit: 2007-06-20
Reputation: ~
Friendster

Re: CSS Base For Friendster Blogs.

thnx ephe! u rock!


:wow:~* Thankz *~ :wow:
:wow:~*Have a Good Day*~:wow:
:wow:~* I'm -"JaY-C"-, By The Way *~:wow:

#13  2007-06-15 08:07:46

imam k
» FriendsterNewbie
Registered: 2007-06-15
Posts: 1
Last visit: 2007-06-15
Reputation: ~

Re: CSS Base For Friendster Blogs.

Code:

/* friendster banner */

.friendster-banner
{
    position: relative;
    width: 100%;
    margin: 0;
    border-bottom: 1px solid #546172;
    padding: 0;
    background: #d5d5d5;
    text-align: center;
}

.friendster-banner-nav-wrapper
{
    background: #e33800 url(URL OF BANNER') repeat-x;; padding-left:0; padding-right:0; padding-top:10px; padding-bottom:10px
}

.friendster-banner-nav
{
    position: static;
    overflow: hidden;
    width: 780px;
    margin: 0 auto;
    text-align: left;
}

.friendster-banner-nav-logo
{
    float: left;
    display: inline;
}

.friendster-banner-nav-links
{
    float: right;
    display: inline;
    color: #fff;
    font-family: arial, helvetica, sans-serif;
}

.friendster-banner-nav-links a:link,
.friendster-banner-nav-links a:hover,
.friendster-banner-nav-links a:active,
.friendster-banner-nav-links a:visited
{
    color: #fff;
}

.friendster-banner-nav-links a:hover,
.friendster-banner-nav-links a:active
{
    text-decoration: underline;
}

.friendster-banner-ad-wrapper
{
    padding: 10px 0;
}

.friendster-banner-ad
{
    position: static;
    overflow: hidden;
    width: 728px;
    margin: 0 auto;
    text-align: center;
}


/* friendster footer */

.friendster-footer
{
    position: relative;
    width: 100%;
    margin: 0;
    padding: 10px 0;
    text-align: center;
}

.friendster-footer-ad
{
    position: static;
    overflow: hidden;
    width: 728px;
    height: 90px;
    margin: 0 auto;
    text-align: left;
    background: #eee;
}

.friendster-footer-nav
{
    width: 728px;
    margin: 10px auto 0;
    font-family: arial, helvetica, sans-serif;
    font-size: 10px;
    text-align: center;
}


/* friendster body ad */

.friendster-body-ad
{
    margin-bottom: 40px;
    text-align: center;
}


/* link banner */

.link-banner
{
    position: relative;
    width: 100%;
    margin: 0;
    border-bottom: 1px solid #ccc;
    background: #fff;
    font-family: helvetica, arial, 'trebuchet ms', sans-serif;
    font-size: 11px;
    text-align: center;
}

.link-banner-inner
{
    display: block;
    position: static;
    width: 672px;
    margin: 0 auto;
    padding: 5px 0;
    text-align: left;
}

.link-banner a, .link-banner a:visited
{
    text-decoration: underline;
    color: #333;
    margin-right: 15px;
}

.link-banner a:hover
{
    text-decoration: underline;
    color: #546172;
}


/* comment form */

#friendster-comment-login { display: block; }
#friendster-comment-form { display: none; }

Last edited by eehjhay (2007-06-16 01:18:52)

#14  2007-06-15 14:25:29

leftalone
» FriendsterGeek
Registered: 2007-04-13
Posts: 1457
Last visit: 2008-08-08
Reputation: 4

Re: CSS Base For Friendster Blogs.

thanks for sharing =)

#15  2007-07-14 21:02:47

bentetres30
» FriendsterTalker
bentetres30's display avatar
http://cotton-candy.net
Location: calif0rnia
Registered: 2007-06-01
Posts: 209
Last visit: 2008-08-09
Reputation: ~
???

Re: CSS Base For Friendster Blogs.

tnx agen for sharing khua ephe..


#16  2007-07-15 08:08:29

Allegra
» FriendsterTalker
Allegra's display avatar
I'm who i'm being...
Location: K.L,Malaysia
Registered: 2007-04-25
Posts: 161
Last visit: 2008-08-18
Reputation: ~
Friendster

Re: CSS Base For Friendster Blogs.

Wow,cool ya!
I vil try 2 apply if i'm free!

#17  2007-09-10 01:34:35

lilis
» FriendsterNewbie
Registered: 2007-08-26
Posts: 2
Last visit: 2008-06-27
Reputation: ~

Re: CSS Base For Friendster Blogs.

:D  gud2  =D but i dont no where the blog description  :crybaby:

#18  2007-09-15 13:53:32

shinbi12105
» FriendsterNewbie
shinbi12105's display avatar
++GothIcCc ++
Location: Quezon,Philippines
Registered: 2007-08-21
Posts: 94
Last visit: 2008-08-20
Reputation: ~
Friendster

Re: CSS Base For Friendster Blogs.

tHAnKs foR shaRinG ..

++ keEP it uP ++




siG by: applerain .. n_n

#19  2007-09-17 05:55:43

fando91
» Promoter
fando91's display avatar
[ Chevaliér dé L'empire ]
Class-S
Location: Légion d'honneur
Registered: 2007-08-19
Posts: 1797
Last visit: Yesterday
Reputation: 17
Friendster

Re: CSS Base For Friendster Blogs.

u roxx ephe!!!

this'll help..

keep on rockin'!!!

  :thumbsup: =)  :eh:  =)  :thumbsup:

#20  2007-09-27 16:04:26

k8
» Moderator
k8's display avatar
One day I will be..
Location: UK
Registered: 2007-09-17
Posts: 2623
Reputation: 10

Re: CSS Base For Friendster Blogs.

oh..i didnt know that blog also can be tweak.. :O
thanks eph!im gonna tweak my blog later.. :D  :thumbsup:


I am what I am..

Board footer

FriendsterTalk is not affiliated with Friendster.com
Copyright © 2002–2008 PunBB

[ 30 queries - 1.240 second ]

FriendsterTalk.com x

Welcome to FriendsterTalk! You'll need to login in order to fully use all the features and view all the sections of this site.

Please register if you're not yet a member. =)