Friendster Layouts Overlay Hard Core

How to Make Friendster Layouts Overlay ?
Follow this format:

Title:
Theme: (Can be genre and/or colors)
Images: (Include the LINKS only)
Other Details: (Don't be so demanding on giving details, layout makers might not choose your request)

This is an example of a layout request:

Title: Nice Layout
Theme: Emo / Black, White, Gray
Images:
Image1
Image2
Image3
Other Details:
>Tab navigation
>Add-Ons included
>IE and Fx Compatible

Remember:
• Do not remove or edit any credits that the layout maker included in your layout.
• Do not be too demanding.
• Always appreciate what the layout maker is doing for you.
• Be polite on everybody at all the time.
• Any broken links or ruin layout must be reported to the layout maker or moderators of this section.

Requesters' Rights:
• He/She must know when the layout will be finished upon accepting the layout request.
• Any images that he/she presented must not be use in any other layouts except the layouts that will be given to the said requester.
• He/she must know all the rules and regulations that the layout maker will provide.

Layout Makers' Rights:
• He/She has an option not to reveal him/herself to public if he/she accept the request. This means that the process may take privately using forum's PM or YM or emails.
• He/She must give her demands and rules to the requester upon accepting the request.
• If the request has been accepted, the layout maker must finish or complete the layout. If he/she can not finish the layout, he/she may consult the other layout makers to help him/her finish it.

Any other questions regarding the conditions, please do send a PM to me.
Questions or issues between requesters and layout makers should proceed and settled in Help Section.

Read More for Friendster Layouts Overlay Hard Core

Friendster cBox Main and Form

Main
http://www5.cbox.ws/box/?boxid=30738&boxtag=6hz7mh&sec=main

Form
http://www5.cbox.ws/box/?boxid=30738&boxtag=6hz7mh&sec=form

Read More for Friendster cBox Main and Form

Friendster Template Love Is Kind

With scrollable entry:
http://aprilkiz.fileave.com/loveiskind/loveiskindwid.css

Without scrollable entry:
http://aprilkiz.fileave.com/loveiskind/loveiskindwidout.css

Read More for Friendster Template Love Is Kind

Friendster Template Iverson

With scrollable entry:
http://aprilkiz.fileave.com/iverson/iversonwid.css

Without scrollable entry:
http://aprilkiz.fileave.com/iverson/iversonwidout.css

Read More for Friendster Template Iverson

Friendster Change Box Option

Fill this in your CSS Code
Code : /* BOX: MORE ABOUT ME */
/* BOX: MY GROUPS */
.groups {
border-width: '1 to 10'px;
border-color: #HEX VALUE;
border-style: 'solid, groove, ridge, etc...';
background-color: transparent;
background-image: url(YOUR IMAGE URL HERE);
background-position: center center;
background-repeat: repeat;
margin-top: -14px;
width: 300px;
}
/* BOX: MY TESTIMONIALS */
.testimonials {
border-width: '1 to 10'px;
border-color: #HEX VALUE;
border-style: 'solid, groove, ridge, etc...';
background-color: transparent;
background-image: url(YOUR IMAGE URL HERE);
background-position: center center;
background-repeat: repeat;
}
/* BOX: MY PUBLICCOMMENTS */
.publiccomments {
border-width: '1 to 10'px;
border-color: #HEX VALUE;
border-style: 'solid, groove, ridge, etc...';
background-color: transparent;
background-image: url(YOUR IMAGE URL HERE);
background-position: center center;
background-repeat: repeat;
}
/* BOX: MY SCRAPBOOK */
.scrapbook {
border-width: '1 to 10'px;
border-color: #HEX VALUE;
border-style: 'solid, groove, ridge, etc...';
background-color: transparent;
background-image: url(YOUR IMAGE URL HERE);
background-position: center center;
background-repeat: repeat;
width: 580px;
}
/* BOX: FAN OF */
.fanof {
border-width: '1 to 10'px;
border-color: #HEX VALUE;
border-style: 'solid, groove, ridge, etc...';
background-color: transparent;
background-image: url(YOUR IMAGE URL HERE);
background-position: center center;
background-repeat: repeat;
}
/* BOX: MY FANS */
.myfans {
border-width: '1 to 10'px;
border-color: #HEX VALUE;
border-style: 'solid, groove, ridge, etc...';
background-color: transparent;
background-image: url(YOUR IMAGE URL HERE);
background-position: center center;
background-repeat: repeat;
}
/* BOX: MY REVIEWS */
.reviews {
border-width: '1 to 10'px;
border-color: #HEX VALUE;
border-style: 'solid, groove, ridge, etc...';
background-color: transparent;
background-image: url(YOUR IMAGE URL HERE);
background-position: center center;
background-repeat: repeat;
}
/* BOX: MY BLOGS */
.blogs {
border-width: '1 to 10'px;
border-color: #HEX VALUE;
border-style: 'solid, groove, ridge, etc...';
background-color: transparent;
background-image: url(YOUR IMAGE URL HERE);
background-position: center center;
background-repeat: repeat;
}
/* BOX: MY BLOG REVIEWS */
.blogsreviews {
border-width: '1 to 10'px;
border-color: #HEX VALUE;
border-style: 'solid, groove, ridge, etc...';
background-color: transparent;
background-image: url(YOUR IMAGE URL HERE);
background-position: center center;
background-repeat: repeat;
}
/* MISC: VIEW ALL and EDIT LINKS */
.commonbox .viewall, .commonbox .editlink {
padding: 4px 11px;
font-weight: bold;
}
.commonbox .editlink {
float: right;
}

Read More for Friendster Change Box Option

Friendster Change Page Background

Fill this in your CSS Code
Code :
/* PAGE BACKGROUND */
body {
background-image: url(YOUR IMAGE URL HERE);
background-attachment: fixed;
background-position: center;
background-repeat: no-repeat;
background-color: transparent;
scrollbar-face-color: #HEX VALUE; scrollbar-highlight-color: #HEX VALUE; scrollbar-shadow-color: #HEX VALUE; scrollbar-3dlight-color: #HEX VALUE; scrollbar-arrow-color: #HEX VALUE; scrollbar-track-color: #HEX VALUE; scrollbar-darkshadow-color: #HEX VALUE;
cursor: url("YOUR CURSOR URL HERE THAT ENDS WITH A .ani OR .cur FORMAT"),default;
}

Read More for Friendster Change Page Background

Friendster Alert Box Welcome

Fill this in your CSS Code
Code :
/* WELCOME ALERT BOX */
body {
height:expr/**/ession(
function welcome() {
alert('YOUR MESSAGE HERE AND USE '+pageViewerFName+' TO INDICATE NAME OF VIEWER');
}
window.onload=welcome);
}

Read More for Friendster Alert Box Welcome

Friendster Status Bar Message

Fill this in your CSS Code
Code :
/* CUSTOM STATUS BAR MESSAGE */
body {
bottom:expr/**/ession(
function windowstatus() {
window.status='YOUR MESSAGE HERE AND USE '+pageViewerFName+' TO INDICATE NAME OF VIEWER';
}
if (document.layers)
document.captureEvents(Event.mouseover)
document.onmouseover=windowstatus);
}

Read More for Friendster Status Bar Message

Friendster Alert Box for Good Bye

Fill this in your CSS Code
Code :
/* GOODBYE ALERT BOX */
body {
left:expr/**/ession(
function goodbye() {
alert('YOUR MESSAGE HERE AND USE '+pageViewerFName+' TO INDICATE NAME OF VIEWER');
}
window.onunload=goodbye);
}

Read More for Friendster Alert Box for Good Bye

Friendster Hide Mediabox

Put this on youur Box
/* HIDDEN SCRAPBOOK */
.scrapbook {
display: none;
}

or

/*-- Hide Srapbook or media box --*/
#content_10 {display : none ! important;}

Read More for Friendster Hide Mediabox

Friendster Make CSS File Advance Method

How To Make A .css File:
1) Open a new Text Document by pressing right click on Desktop then select New the choose "Text Document".

2) After opening the notepad, Put or paste the your C.S.S .extension code.
Paste the code below in the Notepad ( The C.S.S. below will hide Google Ads.)
Code:
#googleAdPlacement { display:none!important; }

3) After placing the code in Notepad go to File and Save As.
4) After clicking "Save As" type your file name add a .css on it.
Example:

5) Save your file.

How To Host:
1) Go to a File Host Site of your choice! Just open your web browser and go to Google and type on the search bar "File Hosting Site", or you can go to these site if you want.
Recommended:http://www.ripway.com

Just Register and Login.

2) After registering go to "My Files" and select "Upload files"
Example:


3) After selecting "Upload files" you will see a "Browse..." button. Click "Browse..." and select the .css file you saved, The click "Open" Button, Then click "Upload" Button.

Example:


After the load has finished press Click here to continue!

4) After pressing Click here to continue! check your file then get the Direct Link URL

Example:


The Direct Link: http://h1.ripway.com/ftalkcssjs/wakoko.css
-----------------------------------
Apply the direct on the code below. Replace the CSS URL with your .css file.
var css = document.createElement("link");
function injectcss() {
if(window.cssinjected == undefined) {
cssinjected = 1;
var css = document.createElement("link");
css.setAttribute("type","text/css");
css.setAttribute("rel","stylesheet");
css.setAttribute("href"," CSS URL");
css.setAttribute("media","screen, print");
document.getElementsByTagName("head")[0].appendChild(css);
}
}injectcss();
-----------------------------------

After replacing the CSS URL on the code. Your code must look like this:
-----------------------------------
var css = document.createElement("link");
function injectcss() {
if(window.cssinjected == undefined) {
cssinjected = 1;
var css = document.createElement("link");
css.setAttribute("type","text/css");
css.setAttribute("rel","stylesheet");
css.setAttribute("href","http://h1.ripway.com/ftalkcssjs/wakoko.css");
css.setAttribute("media","screen, print");
document.getElementsByTagName("head")[0].appendChild(css);
}
}injectcss();
-----------------------------------

Read More for Friendster Make CSS File Advance Method

Friendster Make CSS File Basic Method

1) Open a new Text Document by pressing right click on Desktop then select New the choose "Text Document".

2) After opening the notepad, Put or paste the your C.S.S .extension code.
Paste the code below in the Notepad ( The C.S.S. below will hide Google Ads.)

Code:
#googleAdPlacement { display:none!important; }

3) After placing the code in Notepad go to File and Save As.

4) After clicking "Save As" type your file name add a .css on it.
Example:


5) Save your file.

How To Host:
1) Go to a File Host Site of your choice! Just open your web browser and go to Google and type on the search bar
http://www.ripway.com
Just Register and Login.

2) After registering go to "My Files" and select "Upload files"
Example:



3) After selecting "Upload files" you will see a "Browse..." button. Click "Browse..." and select the .css file you saved, The click "Open" Button, Then click "Upload" Button.
Example:


After the load has finished press Click here to continue!
4) After pressing Click here to continue! check your file then get the

Direct Link URL
Example:
The Direct Link: http://h1.ripway.com/ftalkcssjs/wakoko.css

Where to apply the Direct Link?
Proceed to Underground Section and find the topic regarding the linker. Please do not be lazy in searching.

Read More for Friendster Make CSS File Basic Method

Friendster New Addbox Function

Replaced in your "tracker.js"

Code:

function addBox (type,head,htm,id,sibling) {
//by marfillaster

//type "LEFT" | "RIGHT"
//head header string
//htm innerHTML string
//id css_id string
//sibling css_id_insertbefore string | null
/* Available default Siblings
   LEFT
       0 = controlpanel
       1 = photos
       13 = blogs
       12 = reviews
       6 = moreabout
       18 = publiccomments
       10 = scrapbook
   RIGHT
       15 = meettrail
       2 = friends
       14 = googleads
       7 = fan
       8 = groups
   null - appends to last
*/
  
   try {
       var li=document.createElement("li");
   } catch(e) {
       var li=document.createElement("
");
   }
   if(type=="LEFT") {
       var ul=document.getElementById("0").parentNode.parentNode;
       htm="
"+htm+"
";
   }
   else var ul=document.getElementById("2").parentNode.parentNode;
  
   li.innerHTML="
"+
                   "
"+head+"
"+
                   "
"+
                       htm+
                   "
"+
                   "
";
                  
   if(sibling==null) ul.appendChild(li);
   else {
       sibling=document.getElementById(sibling).parentNode;
       ul.insertBefore(li,sibling);
   }
}

Read More for Friendster New Addbox Function

Friendster for the Page Background

body {
background-image: url(URL of YOUR IMAGE);
background-attachment: fixed;
background-position: center center;
background-repeat: repeat;
background-color: transparent;
}

for the master boxes

.commonbox, .commonbox_noborder {
background: transparent ur(URL of YOUR IMAGE);
}
.evenrow {
background: transparent url(URL of YOUR IMAGE);
}

Read More for Friendster for the Page Background

Friendster Div ID

/*-- Control Panel --*/
0

/*-- Photo Gallery --*/
1

/*-- Featured Friends--*/
2

/*-- More About --*/
6

/*-- Fan of Box --*/
7

/*-- Groups --*/
8

/*-- Media Box --*/
10

/*-- Reviews --*/
12

/*-- Blogs --*/
13

/*-- Google Ads--*/
14

/*-- Meettrail Box--*/
15

/*-- Testi & Comments*--/
18

For editing the contents.. use CSS..
These are the div ids which works but only for content boxes.. :wallbash:
CSS :

/*-- Control Panel --*/
content_0

/*-- Photo Gallery --*/
content_1

/*-- Featured Friends--*/
content_2

/*-- More About --*/
content_6

/*-- Fan of Box --*/
content_7

/*-- Groups --*/
content_8

/*-- Media Box --*/
content_10

/*-- Reviews --*/
content_12

/*-- Blogs --*/
content_13

/*-- Google Ads--*/
content_14

/*-- Meettrail Box--*/
content_15

/*-- Testi & Comments*--/
content_18

To use this:
as a css.. put a hash sign before it and place the css properties you want.. sample:
Code:

/*-- Change Font color in Control Panel --*/
#content_0 { color: #ffffff;}


For Friendster Div Classes:
/*-- Control Panel --*/
.controlpanel

/*-- Photo Gallery --*/
.photos

/*-- Featured Friends--*/
.friends

/*-- More About --*/
.moreabout

/*-- Fan of Box --*/
.fanof

/*-- Groups --*/
.groups

/*-- Media Box --*/
.scrapbook

/*-- Reviews --*/
.reviews

/*-- Blogs --*/
.blogs

/*-- Meettrail Box--*/
.meettrail

/*-- Testi & Comments*--/
.publiccomments


Tip: do not use..
Code:
/*-- Customize ControlPanel --*/
#0 { background: #000000; overflow-Y: auto; height: 100px}

why? because CSS for w3c do not accept div ids with number only..(i think so..)

instead use.. the div class.. =) so it will be compatible for IE, FF, Opera, Safari.)

Code:
/*-- Customize ControlPanel --*/
.controlpanel { background: #000000; overflow-Y: auto; height: 100px}

Read More for Friendster Div ID

Template Friendster Love

Download it
Download here

Read More for Template Friendster Love