Welcome Guest ( Log In | Register )



 
 Reply to this topicStart new topic
> The Step Up. A Guide For Myspace Design, Actual code is included here :)
Ghost
post Sep 9 2007, 03:30 PM
Post #1


Newbie [ Level 2 ]
Group Icon

Group: Members
Posts: 12
Joined: 9-September 07
From: U.S.
Member No.: 24,727
Well I used to have trouble just getting what I wanted. The basic codes for creating myspace layouts. Am I right they seem to be hard to find. Well not no more! Here I shall include all of the css codes I know for myspace.

Well lets start with the background image

CODE
<Style type="text/css"> body{ background-color:000000; background-image:url(put a direct html link to your image here for the background); background-position:Center Center; background-attachment: fixed; background-repeat:no-repeat; scrollbar-track-color:000000; scrollbar-face-color:FF0000; scrollbar-highlight-color:FF0000; scrollbar-base-color:FF0000; scrollbar-darkShadow-color:000000; scrollbar-shadow-color:FF0000; scrollbar-arrow-color:000000; } .contactTable {width:300px !important; height:150px !important; padding:0px !important;
background-image:url("your image direct html link goes 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>


and if that makes you scratch your head hereis some more detailed info

Here is the part where you insert veriables forthe background image

CODE
body{ background-color:000000; background-image:url(put a direct html link to your image here for the background); background-position:Center Center; background-attachment: fixed; background-repeat:no-repeat;


For the postion option the first variable is the vertal position and the second is the horizontal position.
The background attachment option determines what the image does. fixed = when you scroll the image stays in view. scroll = the image will stay put and disapear basically if you scroll down or up.

And now we move onto the scroll bar
CODE
scrollbar-track-color:000000; scrollbar-face-color:FF0000; scrollbar-highlight-color:FF0000; scrollbar-base-color:FF0000; scrollbar-darkShadow-color:000000; scrollbar-shadow-color:FF0000; scrollbar-arrow-color:000000;


All I can tell you here is to try and mess around a bit with the colors till you get what you want

Ok and now for the contact table

CODE
.contactTable {width:300px !important; height:150px !important; padding:0px !important;
background-image:url("your image direct html link goes 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;}


These are basic settings for the contact table. I recommend not messing with these settings. Its best just to only find what image you want and put the direct html link in there and thats all.

Ok and now we move onto extras

this code will resize your images on your profile so that they are not taking up too much space.
CODE
{resizing images for friends space}
td.text td.text table table table td a img {width:80px;}
{resize the online now icon to normal size}
td.text td.text table table td img {width:260px; max-width:260px; width:auto;}
td.text td.text table table td a img {width:90px; max-width:260px; width:auto;}
td.text td.text table table td div img {width:80px;}
* html td.text td.text table table td img {width:260px;}
* html td.text td.text table table td a img {width:90px;}
* html td.text td.text table table td div img {width:80px;}
td.text td.text table table table td div img {width:80px;}


Here is code for a comment box that can be place anywhere css is alowed.

CODE
<center>
<form method="post" action="http://comments.myspace.com/index.cfm?fuseaction=user.ConfirmComment">
<input type="hidden" name="friendID" value="208028370">
<textarea name="f_comments" cols="50" rows="10">Type anything that you want pre-wrote</textarea><br>
<input type="submit" value="Comment"> <input type="reset" value="Reset"></form><br>
</center>

<style type="text/css">
  textarea {background-color:000000;
  background-image:url(Place direct html image link here);
  border-width:2px; border-style:ridge;
  border-color:FF9900; color: FF9900; font-family:;}
  input {background-color: 000000; border-width:2px; border-style:ridge; border-color:FF9900; color: FF9900; font-family:;}
</style></center>

Dont forget to change the part where you have something pre-wrote in the box already
The background image is optional


well thats all i got for now. I hope you liked my help. If you have any qeustions or comments feel free to post them. And also id love to hear suggestions. ty
Go to the top of the page
 
+Quote Post
Chesso
post Sep 10 2007, 09:35 AM
Post #2


Teh Coder
Group Icon

Group: Members
Posts: 1,053
Joined: 18-April 06
From: Australia
Member No.: 12,833
That's useful information, although I completely despise online social networking sites (myspace in particular), my missus is into them.

And I have tried to help her build or find suitable layouts and such but can never get anything really working too well.

It would be wonderful if you could eventually construct a full on guide, especially including information on how to avoid making pages as slow and crash prone as many are lol.
Go to the top of the page
 
+Quote Post
Ghost
post Sep 10 2007, 10:28 PM
Post #3


Newbie [ Level 2 ]
Group Icon

Group: Members
Posts: 12
Joined: 9-September 07
From: U.S.
Member No.: 24,727
Yeah Im workin on a guide here at home itl be done sometime soon here. It has basicly a full walkthrough to creating a typical myspace profile. Oh um im also tryin to work on a stand alone profile editor but im trying to figure what I should use to make it.
Go to the top of the page
 
+Quote Post
« Next Oldest · Web Design and HTML · Next Newest »
 

Reply to this topicStart new topic

Collapse

> Similar Topics

Topics Topics
  1. Need A Free Graphic Design Software? Try Paint.net!(1)
  2. phpBB avatar_path PHP Code Execution Vulnerability(5)
  3. How To Create A "user Profile" Page.(14)
  4. A Guide To Use Dc++(1)
  5. How To Design A Contact Form Part 3(0)
  6. Code To Send An Email From A Form(10)
  7. Free Code Snippets And Css Layout(14)
  8. Linux Partitioning Guide (new Users)(1)
  9. How To Design A Form In Flex 2(0)
  10. A Free Graphic Design Program That Could Equal Photoshop?(35)
  11. Mp3 Codes For Myspace & Friendster(2)
  12. Imho, You'll Be Rotfl!(12)
  13. Design A Contact Form In Flex Part 1(0)
  14. Add A Forum To Your Site(23)
  15. Runescape Money Guide(50)
  1. Phishing In Myspace(8)
  2. Activation Code(7)
  3. Myspace Gold Script(2)
  4. Rags To Riches Iv - My Best Guide(10)
  5. Instant Replay Code?(0)
  6. Uploading Image File Through JSP Code To Server(9)
  7. How To Connect Dual/triple Monitor + Advantages(21)
  8. An Absolute Basic Guide To Algorithms For Dummies(0)
  9. Php Random Selector(2)
  10. How To Make An Test-based Rpg Game!(4)
  11. (Nearly) Ultimate Music Posting Guide(11)
  12. Do You Program/code Your Own Games(11)
  13. Myspace Video Help!(6)
  14. Runescape Multi Logon Guide(7)
  15. Help(3)


 

Display Mode: Standard · Switch to: Linear+ · Switch to: Outline

Track this topic · Email this topic · Print this topic · Subscribe to this forum

- Lo-Fi Version Time is now: 16th October 2008 - 02:51 AM
Powered By IP.Board 2.2.1 © 2008  IPS, Inc.
Licensed to: Xisto Corporation