EDiT PROFIL FRIENDSTER Over Layout Hello Kitty

switpotato» FriendsterWhiz

› dcrazier dbetter bxtreme› Class XLocation: HubbieHubbieLandRegistered: 2007-05-23Posts: 2708Reputation: 256

make an overlay profile w/o using or downloading any prog. (table ed.)

how to make an overlay layout that look like this

preview:http://www.geocities.com/apolpie.n_nugg … orial.html

first i didnt include the css codes...herejuz plain design for main page itself..

http://friendstertalk.com/p=switpotato

http://www.geocities.com/apolpie.n_nuggets/switpotatotuitorial.html

http://friendstertalk.com/g=Class+X

u dont need any prog for this tricks...all u need are:

1. ready made images.. banner ...2. geocities acct3 tons of...imagination

lets start:

open an acct in geocities...u will be redirected to home.. click... the button that says...create and update... file manager...open file.. then NEW

legend:title.... where u will put ur page namehead ..where u wil insert ur css codes like scrollbar etc..body... for main page design ( codes for ur table)...javascript likestatusbar etc etc...be sure to save ur work ...with an ending of .html ( dot html)

then look for table launcher ( LAUNCH TABLE MAKER)we will use this to view the possible size of ur table... assign specific location ( centered..left etc.. make margin padding etc etc...)

let say ill be using this banner for my overlay

at table laucher i specify the length of my talbe w/c accords with my banner properties..i made a table with 2 row.. 1column.. ... press SHOW HTML to view the codes copy paste those and insert bet ur <BODY>< /BODY> tag we will have something that look like this

original codes from table launcher:

Code:

<TABLE WIDTH="729" BGCOLOR="#FFCCCC" ALIGN="center" CELLSPACING="0" CELLPADDING="0" BORDER="0"><TR><TD></TD></TR><TR><TD>2</TD></TR></TABLE>

alter the tdlet say ill use the 1st TD for may bannerthen the 2nd for my navigation

Code:

<TABLE WIDTH="729" BGCOLOR="#FFCCCC" ALIGN="center" CELLSPACING="0" CELLPADDING="0" BORDER="0"background="http://i180.photobucket.com/albums/x225/monikamote/monix1.gif"><TR><TD>

<center/><img src="http://i180.photobucket.com/albums/x225/monikamote/pixnixbanner.gif"></center>

</TD></TR><TR><TD height="10px">

<font face="Arial" size="1" color="#F38383"> <a href="http://www.friendster.com/">Home</a> | <a href="http://www.friendster.com/user.php">Profile</a> | <a href="http://www.friendster.com/friends.php">Friends</a> | <a href="http://www.friendster.com/gallery.php">Search</a> | <a href="http://grouper.friendster.com">Videos</a> | <a href="http://classifieds.friendster.com/fi">Classified</a> | <a href="http://www.friendster.com/logout.php">Log yourselft out</a> kamote concept™</font>

</TD></TR></TABLE>

take note: codes for space be cautious in my td and table wherein i add some tweaks like bg and specific height

now wer doen for upper part..lets do then the main content ..menu of our pagelet say ill make a 3 column.. 1 row table..

original codes:

Code:

<TABLE WIDTH="729" BGCOLOR="#FFCCCC" ALIGN="center" CELLSPACING="2" CELLPADDING="3" BORDER="0"><TR><TD>1</TD><TD>2</TD><TD>3</TD></TR></TABLE>

then alter be noted with changes i done with my TD and TABLE..

Code:

<TABLE WIDTH="729" BGCOLOR="#FFCCCC" ALIGN="center" CELLSPACING="3" CELLPADDING="3" BORDER="0" background="http://i180.photobucket.com/albums/x225/monikamote/monix2.gif"><TR><TD width="180" height="400" overflow:" auto" background="http://i180.photobucket.com/albums/x225/monikamote/jryt.jpg" >

</TD>

<TD width="320" height="400" background="http://i180.photobucket.com/albums/x225/monikamote/jryt.jpg">

</TD>


</TD></TR></TABLE>

take note: u may add inside the td ur chatbox... all pa ekek ( xtra )modues codes..and div so ur page wont get long

i add this table for my credits w/c is optional since u may include this inside the above mention TD

Code:

<table border="0" align="center" width="729" height="39" cellspacing="0" cellpadding="0" background="http://i147.photobucket.com/albums/r299/switpotato/joyzzelogoheart.png"> <tr> <td><font face="Arial" size="1" color="salmon"> Credits: <a target="_blank" href="http://www..com">Hello kitty</a> | <a target="_blank" href="http://www.">c..for the OG</a> | <a target="_blank" href="http://www.photobucket.com">photobucket</a> | <a target="_blank" href="http://www.">kamote works</a> | <a target="_blank" href="http://www.imageshack.com">imageshack</a> </a> </td></tr>

</table>

this part is for my friendster footer etc... w/c then i decided to be just an ordinary txt w/o table ..

Code:

<p align="center"><font face="Arial" size="2" color="salmon"><center><b style="font-size:9"><a href="#">About Us</a> | <a href="#">Contact Us</a> | <a href="">Events</a> | <a href="#">Promote My Profile</a> | <a href="#">Help</a> | <a href="#">Terms of Service</a> | <a href="#">Privacy Policy</a><BR>Copyright 2002-2006 Friendster, Inc. All rights reserved. U.S.<br><br><br>

<Center><img src="http://i147.photobucket.com/albums/r299/switpotato/TBDaisy1.gif"></center><center><b style="font-size:10">[email protected]</center></b><br><br>

overlay wont b complete w/o css pls check site like dynamic drive ..etc for more tricks..for add ons pls browse the forum like modules for specific div etc...

Last edited by switpotato (2007-08-07 00:54:58)

.. thnx Q ..kabit.. dai dai... muahhss<br>

to all wakaka... wat the hell... prove more before u claim some

#2 2007-08-03 02:05:34





http://friendstertalk.com/p154701-2007-08-03-02%3A05%3A34.html#p154701

Re: make an overlay profile w/o using or downloading any prog. (table ed.)

con't: Adding Contents for Specific TD

like what i said for the page design not to b distorted add DIV

sampleat my left TD wherein i put my menu... friends photo.. and kitty clocki uses this codes...

Code:

<TD width="180" height="400" background="http://i180.photobucket.com/albums/x225/monikamote/jryt.jpg" >

<center><div align="center"><div style="height:340;width:180;overflow:auto"><br>

put anything here page length wont be affected since we set auto scroll when we reach limit height of340...

why 340 .. since i inserted my clock codes that i dont want to b hide if the viewer scroll downso meaning to say i paste it outside my div

</div>

i inserted here my clock codes

</td>

for my middle TD

i consume the entire space... i set my DIV with this value..

Code:


<center><div align="center"><div style="height:400;width:320;overflow:auto"><br><span >Love Me or Hate me</span><br><br>( i added another div na less ang width so para di rumble ang mga laman ko ...)

<div style="height:160;width:290;overflow:auto">

put anything here

</div>

( continue ang process as long as u want)

<div style="height:160;width:290;overflow:auto">

</div>

</div></td>

for ryt td same procedure ...

for overlay css pls browse the forum i posted there the most commonly use css...add ons like aut modules... have own css so worry not about that..

:)thats all folks...

preview:

http://www.geocities.com/apolpie.n_nugg … orial.html



#3 2007-08-03 07:50:08

eehjhay» Moderator

› Im a daddy already! :D› Class XLocation: Liverpool NSW AURegistered: 2007-02-13


http://friendstertalk.com/p=eehjhay


http://www.geocities.com/apolpie.n_nuggets/switpotatotuitorial.html

Posts: 4319Last visit: YesterdayReputation: 115Friendster


Thanks for this.

Topic sticked

-Offline-

#4 2007-08-03 09:48:06




very much welcome Mr. Mod...




http://www.friendster.com/43404487

http://www.eehjhay.net/




#5 2007-08-04 02:44:50




ahhh.. ok this basic procedure can be applied not only forfriendster overlay...u can use this as ur basic page for ur frame tooor own private website etc...and if u master the tricks... u can emulate toothe slicing tech ..mapping by adding some opacity and td..but lets leave those to the expert lol...




Documents

EDiT PROFIL FRIENDSTER Over Layout Hello Kitty