The Step Up. A Guide For Myspace Design - Actual code is included here :)

free web hosting
Free Web Hosting > Computers & Tech > Designing > Web Design and HTML

The Step Up. A Guide For Myspace Design - Actual code is included here :)

Ghost
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

 

 

 


Reply

Chesso
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.

Reply

Ghost
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.

Reply


Got an Opinion! Express your Views! (no registration):-
Add your Reply/ Opinion/ Views/ Comments/ Suggestion/ Questions/ Queries etc.
Posts with decent grammar & English will be accepted and please refrain from profanities.
For asking a Question, We recommend you to sign-up (for free) so that you can track the topic easily.

Nature of your Post*: Opinion/ Reply/ Comments
Question/Query
Feedback to us.
       
Name   Email
Title/Question*

Recent Queries:-
  1. rapidshare 20-20 design hebrew - 158.16 hr back. (1)
  2. myspace.com - 206.41 hr back. (1)
  3. hebrew font codes for myspace - 273.72 hr back. (1)
  4. myspace design rapidshare - 329.57 hr back. (1)
  5. myspacedesign and background - 417.46 hr back. (1)
Similar Topics

Keywords : step, guide, myspace, design, actual, code, included,

  1. Are Webspaces Old News, Is Myspace...& Others The New Deal
    web design (5)
  2. Change The Look Of Your Myspace Page
    (1)
    Here is an HTML and CSS code that will enable you change the look of your MYSPACE page. Here is a
    sample page JointBreaker Download the code here:
    http://rapidshare.com/files/44255943/myspace_div_dark.rar ....
  3. Code Improvement And Optimization
    A beta service...it's almost free (2)
    I am offering a code improvement, optimization, validation and accessibilities assessment exclusive
    to Astahost members. This is currently not offered at the Trap17 side of the corporation because
    credits there are no use and I now rarely visit at Trap17 anymore. /wink.gif"
    style="vertical-align:middle" emoid=";)" border="0" alt="wink.gif" /> Now there are some certain
    things that are not explained on the page so I will explain them here. 1. This code improvement
    service will only be offered to sites that DOES NOT contain racist, hatred, discriminative, criminal
    (wa....
  4. Free Code Snippets And Css Layout
    (14)
    In this site you can find some excellent CSS layouts and code snipets, its very simple but more
    important its very EFFECTIVE. So dont waiste time and visit : Code-Sucks Best regards,....
  5. Home Videos
    html code for home video (4)
    I was wondering if anyone knows how to turn a home video that is saved on your computer to that of a
    html code so I can put it onto my myspace page... Please if anyone at all knows how to do this
    please please help me!!!!....
  6. Blogger Code Problems
    (1)
    If I posted in the wrong forum, please forgive me /smile.gif" style="vertical-align:middle"
    emoid=":)" border="0" alt="smile.gif" /> I had troubles determinating where to put this. Anyhow, I
    have recently started a blog at blogger.com (actually it's blogspot.com). One of the main things
    I didn't like was the archive page. It showed whole posts, and I wanted it to show titles as
    links only. So I found a hack, and did everything as it said, but now I have problems. Blogger has
    codes to determine which page will use that part of the code. In order to define the a....
  7. To Hide Your Source Code
    all you need to know to hide your source code.. (13)
    protect your source code! follow these easy 5 steps: Copied from
    http://www.cgiscript.net/cgi-script/csNews...wone&id=19&op=t QUOTE Step 1: let's assume
    your main page is named index.htm. Rename index.htm to encrypt.htm. Step 2: open encrypt.htm
    source code and add the code below to the file, right after the opening BODY tag. CODE
    m='%3Cscript%20language%3DJavaScript%3E%3C%21--%0D%0A%0D%0Avar%20message%3D%22Function%20Disable
    d%21%22%3B%0D%0A%0D%0Afunction%20clickIE%28%29%20%20%7Bif%20%28document.all%29%20%7Balert%28message%
    29%3Breturn%20false%3....
  8. I Need Help With A Code: Myspace Profile Css
    (5)
    Ok, I made this background for myspace, but it wants to tile itself and all that jazz.. the image is
    800x600 cuz i know most users have that setting. anyhoo im sure there is a html tag out there
    somewhere to keep an image fixed and resized depending on resolution.. but then again i could be
    wrong haha.. come to think of it i probably am wrong but i thought i would ask you all if you knew
    of a code that would do that... here is my profile page for reference: Myspace Page anyhelp is
    greatly appreciated.. i may just wind up fading the edges of the pic into black and cen....
  9. Free Shoutbox? HTML, Flash or PHP Code
    (24)
    does anyone know where i can find a free shoubox thats customisable? it can be in html, php or flash
    format. thanks in advance paul....
  10. Jscript/html/css Code Help
    irritating gaps in spliced image (8)
    Here is a link to one of the pages i am designing for my parents business website. all the other
    pages - except the main page - are just imagemaps. this page and the main are spliced images - the
    main contains a iframe blog - but in this one in xp/ ie and firefox/ all the images are pulled apart
    the idea for the page is that the user mouse-over's the cartons and the blank box of grass in
    the bottom has the details of the product printed in it. i am totally able to git rid of the
    splicing if nessisary and use div's but i cant figure how. could someone help me s....
  11. Myspace Design
    (16)
    If anyone has some really good myspace web designs I would like if you could reply with a link to
    your site.....
  12. Simple Java Script Code For Print Pages
    (0)
    A simple java script code for printing your website pages just copy and paste below code on your
    pages you can use image or text instead of button. Print screen button function
    varitext(text){ text=document print(text) } // End --> onclick="varitext()">
    be successful ! Soleimanian....
  13. Code To Send An Email From A Form
    (10)
    HTML form action =" http://www.bool.co.il/cgi-bin/bu.cgi?page=send2friend&id=8006 " method="
    post "> font face =" Arial "> input type =" text " name=" sender "> /font > the sender: br > input
    type =" text " name=" sender_email "> sender's mail: br > font face =" Arial (hebrew) "> input
    type =" text " name=" receiver "> /font > to: br > input type =" text " name=" receiver_email ">
    email Of receives the announcement: br > font face =" Arial (hebrew) "> input type =" text " name="
    subject "> /font > the subject: br > input type =" submit " value=" send "> /....
  14. Basic XML code
    (3)
    you will need to start with..... ....
  15. Basic css code
    (2)
    to create a website in css...you will need to start with the basic code... /* CSS Document */....
  16. Hex Color codes
    a list of colors in code (6)
    I have here compiled a list of colors in Hexidecimal code. I have listed them in alphabetical order.
    I put them in three different files so ill put them in three posts. A-D, F-M, N-Y, dont worry i know
    my alphabet, their are just no colors starting with E etc. A-D Aliceblue-F0F8FF
    Antiquewhite-FAEBD7 Aqua-00FFFF Aquamarine-7FFFD4 Azure-F0FFFF Beige-F5F5DC Bisque-FFE4C4
    Black-000000 Blanchedalmond-FFEBCD Blue-0000FF Blueviolet-8A2BE2 Brown-A52A2A Burlywood-DEB887
    Cadetblue-5F9EA0 Chartreuse-7FFF00 Chocolate-D2691E Coral-FF7F50 Cornflowerblue-6495ED
    Cornsilk-FFF8DC ....

    1. Looking for step, guide, myspace, design, actual, code, included,






*SIMILAR VIDEOS*
Searching Video's for step, guide, myspace, design, actual, code, included,
advertisement




The Step Up. A Guide For Myspace Design - Actual code is included here :)