 |
|
|
Intro
I often get questions on customiztion. As a result, I decided to make this handy dandy profile tutorial. This tutorial is made to even the cater to even least HTML/CSS saavy individual. You will see images of exactly what you want changed.
All theses codes can be put into any section. I recommend the very top of your about me; this way it is easy to skip over when you decide to put in your content. You should start off you style sheet with <style> and end with this </style>.
Please let me know if this stylesheet helped you. Send me a myspace message if you are still having trouble.
Stylesheet
Making a stylesheet is very easy. Open wordpad/notepad and put each code inbetween the styletags. Edit colors, sizes, etc. After you've done this right click, copy your stylesheet & paste into your profile.
Step 1 - Body
 If you want a solid color background use this code.
 If you would like a background image use this code. (This combines the up above code.)
Explanation:
background-color: is the the color you wish to use
background-image: is the image url you wish to use
background-attatchment: either fixed or scrolling
background-position: position of background image
bottom left
center left
top left
bottom center
center center
top center
bottom right
center right
top right
background-repeat: determines if your background will repeat
Repeat is better for patterned backgrounds.
No-Repeat is for better for picture backgrounds. This only shows the image once in the pre-determined position.
Step 2 - Text
 To change inputted text: text you write, comment text, etc. Use this code. (Manorexic)
 To change text that is pre-written on myspace use this code. (View My)
 To change all links, including your inputted links, use this code. (View All Blog Entries)
Explantion:
link/active: these are links that a person has yet to visit
visited: these are links that a person has visited
hover: this is what a link changes to when a person is hovering over them
 To change the display of you name above your picture use this code. (ManorexicT)
 To change the blurb/friendspace header & the about me/who i'd like to meet text use this code.
 To change the text in your extended network banner use this code.
 To change xx's latest blog entry/xx has xx many friends use this code.
 To change the number in xx has xx many friends/displaying xx of xx comments use this code.
 To change the date on comments use this code.
 To change the text the header text above your contact box/details/interests use this code.
 To change the text next to general/music/heroes/status/zodiac sign/etc. use this code.
Explanation:
color: the color you want your text to be
font-family: the font you want your text to be (times new roman, arial, etc)
font-size: the size you want your text to be
line-height: this can make the height your text takes up smaller/bigger
If you make this number big than your font-size then it adds a sort of padding. If you make this number smaller than your font-size you may only see part of the text. I suggest inherit, which leaves your text as is.
font-weight: is bold, italic, or normal
text-decoration: is underline, strikethrough, or none
text-transform: is lowercase, uppercase, or normal
letter-spacing: this can make the width your text takes up small/bigger
If you choose to use a positive number your text will be spead out with space inbetween. If you choose to use a negative number (-2) then your text will be pushed together, possibly overlapping.
background-color: this may add a sort of highlight color behind your text
Step 3 - Tables
 To remove the white background behind your tables use this code.(Do not edit this code unless you know what you are doing.)
 To change the background color of the tables on the left use this code. (General Information, Contact Table, Interests, Details, Schools, Groups)
 To change the background image of the tables on the left use this code. (General Information, Contact Table, Interests, Details, Schools, Groups)
 To change the background color of the tables on the right side use this code. (Extended Network, Blog, Blurbs, Friendspace, Comments)
 To change the background image of the tables on the right side use this code. (Extended Network, Blog, Blurbs, Friendspace, Comments)
 To add a border to all tables use this code. (I only advise changing the border-color, border-width, and border-style; unless you know what you are doing.)
Explanation:
border-width: this is how big you would like your border to be
border-style: solid, dashed, or dotted
border-color: this is the color you would like your border to be
 To change the background color of the contact table header use this code.
Add these codes to the bottom of your stylesheet.
(I only advise change the text-transform & text-align; unless you know what you are doing.)
End
Woo hoo. We're all done. I hope your profile looks just down right spiffy. If that's the case then you should link Manorexic from your site; this way even more people can use the tutorial.
written by: Manorexic Layouts
|
|
| |