How to make Cross-Over Layouts [Recommended for Newbies]
Credits by: ebrains&beautye and niceblue

VIDEO TUTORIAL BY NICEBLUE

Watch the step by step TUTORIAL..
click this to watch it:
http://www.youtube.com/watch?v=5ccUdoc5cBE

......................................................................

This page made by ebrains&beautye from friendstertalk.
cause i'm too lazy to make my own.. that's why i grab this tutorial.. oppz! i have a permision to grab this tutorial..

Before we start, I just wanted to let you know that you don't need any knowledge about JS to make Cross-Overs, but you may need to know a little bit about CSS. You don''t need to download any software, you can make all the Cross-Overs you want just being on the net.


What you need:

An Internet Connection
Lots of imagination

OK, let's start:

First, go to http://www.friendster-gens.com and choose Version 1.

Note: Sometimes, a lot of people have been using this site so it gets really busy, that's why there are times that when you click the _link_, you experience an error. It's normal. Just wait for it, understood? Ahaha, I feel like a teacher...



After choosing Version 1, it will redirect you to another page.
This is where the fun starts:



You can fill in all the fields but you can also leave some blank if you don't like that feature.

To the newbies, I'll explain what every field is and it's features:

PAGE BACKGROUND :arrow: This will be the background of your page.

PAGE CURSOR :arrow: This will be your page's cursor.

PAGE SCROLLBARS :arrow: Here, you can customize your scrollbars.

PAGE BORDER :arrow: This is self-explanatory.

GLOBAL TEXTS :arrow: The font color, font size and design of your text.

GLOBAL _link_ :arrow: You can customize the _link_ and what it will look like.

GLOBAL _link_: HOVER :arrow: This is what your _link_ will look like when you hover around it.

MASTER BOXES
MASTER HEADERS
MASTER BOXES: BULLETS :arrow: Here you can change all the content boxes & master headers (Name's Friends, name's Comments etc.) at the same time - whatever _style_s you choose below will be applied to every single module box on your Friendster profile like the Photo Gallery, More About Me, My Blogs, My Testimonials, etc. The master bullet is the tiny image beside your profile's details.

CONTROL PANEL: BOX
CONTROL PANEL: USER PHOTO
CONTROL PANEL: DATA
CONTROL PANEL: BUTTONS
CONTROL PANEL: BUTTONS HOVER :arrow: This is the main box at the top of your profile - the one with the large photo of you, your data (Profile Views, Location, Hometown, Company, Your URL, etc) and the control panel buttons (Send Message, Send a Smile, Add Testimonial, etc.)

MISC: SMALL PHOTOS
MISC: SMALL PHOTO NAMES :arrow: In the Misc section you'll find the _style_s for the small photo thumbnails (in 'My Friends' and 'My Testimonials'), the names below the small photo thumbnails and also for the global 'View All'-_link_s.

PERSONALIZED BANNER/HEADER :arrow: Your personalized banner will appear on top of your profile. Size of the banner is 810x310.

NAVIGATION _link_S :arrow: Your navigation is consists of Home, My profile, My Connection etc. This will change the color of your navigation _link_s.

SHOUT-OUT BOX :arrow:
This will change the font color of your shoutbox. Background is set to transparent.

RECENT UPDATE BOX :arrow: Recent update box is located in your Control panel below your personal details.

_title_ BAR
STATUS BAR :arrow: _title_ Bar and Status Bar will be replaced with your own message. Do not use apostrophe ( ' ).

:exclaim: Before we proceed, you need to make a banner, right? Here's how:
Go to MS Paint.



:thumbsup: Design your banner anyway you want it. After that, save it and upload it to http://www.tinypic.com :thumbsdown:



After uploading, get the direct _link_ and paste it in the PERSONALIZED BANNER/HEADER field. :thumbsdown:



After you've filled it all up, click "Generate Layout Code!



It will redirect you to another page, showing the CSS codes of your layout.



But we are not done yet...

Copy the CSS codes and paste it in notepad or any other Simple Text Editor Program:



Save it as myfile.css



Register at any free web hosting that supports CSS, JS or HTML [Recommended: http://www.ripway.com] and upload your file. If you are already registered, just log in.



Copy the direct _link_ and paste it in the latest _link_er. I can't put the latest _link_er here so pm me.

Hope this helped the newbies out there! I made it very clear for everyone to understand. If the layout is not working, FS probably updated again...
If you still can't understand, PM me... =)

Lol.
This thing does'nt work anymore..i used to use this one but now they moved it. Look at my new post of 'If u need help to make your own crossover, click here, i an help u. [quite easy steps]' I have updated everything and where the new friendster-gens.com is. I forgot the URL for the new website of the new friendster-gens.com but its in my post ^^ Take Care