MySpace Contact Table

1. Start off with a 'New Document' sized at 300 x 150 (normal) or 265 x 163 (smaller) pixels. (I chose 265 x 163).



2. Begin with a blank canvas of a color of your choice. [This will be your background color] (In this case I chose a basic white). Now I have choice my current contact box as a template.



[COPY THIS (CRTL - C) THIS IS YOUR TEMPLATE]

3. Now after you have copied the template, paste it in your document (this will automatically create a 'New Layer'). Your layers will now look like this.



4. Be sure you are in the layer that has your template in it. Change the 'Opacity' of that layer to '30'.



5. Create a 'New Layer'. Grab the 'Rectangular Marquee Tool' in the 'Tool Bar'. Trace over each box in your template (Labled Add me etc.).




5. Go to 'Edit - Fill - Forground Color' and the area will be filled. Now click outside of the area for the area to be deselected.

6. To make it easier, Go to 'Layer - Duplicate' and it that will make a duplicate of the Rectangle filled. Drag the copied layer above another labled box (Add me etc.) and repeat this until you have covered each (Add me, Instant message, etc.) will a retangular.




7. Delete the layer containing the template. Now you can be creative and add text to each retangle box with (SEND MESSAGE, ADD ME, INSTANT MESSAGE, TELL A FRIEND, ADD TO FAVORITES, BLOCK THIS PERSON, RATE PICTURE) or with your own personalized names for each. Add text, color, graphics, even animation if you want to jazz it up a bit.

8. This is my final project! Have fun and good luck!




9. Upload on an image host such as Photobucket. Copy and paste this code in your 'About Me' section of your myspace.

CODE:

<style type="text/css">
.contactTable {width:WIDTH HERE px!important; height:HEIGHT HERE px!important; padding:0px!important; background-image:url("URL HERE"); background-attachment:scroll; background-position:center center; background-repeat:no-repeat; background-color:transparent;}
.contactTable table, table.contactTable td {padding:0px !important; border:0px; background-color:transparent; background-image:none;}
.contactTable a img {visibility:hidden; border:0px!important;}
.contactTable a {display:block; height:28px; width:115px;}
.contactTable .text {font-size:1px!important;}
.contactTable .text, .contactTable a, .contactTable img {filter:none!important;}
</style>


EXAMPLE:

<style type="text/css">
.contactTable {width:265 px!important; height:163 px!important; padding:0px!important; background-image:url("http://i5.photobucket.com/albums/y159/naked_zombie/BLAHAAAAA.jpg"); background-attachment:scroll; background-position:center center; background-repeat:no-repeat; background-color:transparent;}
.contactTable table, table.contactTable td {padding:0px !important; border:0px; background-color:transparent; background-image:none;}
.contactTable a img {visibility:hidden; border:0px!important;}
.contactTable a {display:block; height:28px; width:115px;}
.contactTable .text {font-size:1px!important;}
.contactTable .text, .contactTable a, .contactTable img {filter:none!important;}
</style>




You can come up with anything in a contact box. Here are some of my own creative contact boxes. (Please do not copy in any way, shape, or form)

kool thnx i can use this =)

how do I stop the "contacting name" bar from covering up the top part of the image?

thnx!!

this is hot

Author	carolinegamboa
Submitted on	Apr 29, 2006
Page views	68,081
Favorites	170
Comments	4

contact, table, contact table