How to reset your Myspace Profile Theme using CSS
MySpace Background Template
One of the items I struggled to get right with my brand more than the blog, more than the shirt designs, more than the online store, more than the SEO and link exchanging was the god damn Myspace. I don’t know why, but for some reason a staple of your brand besides a decent Twitter and blog presence is to have a Myspace page. Add us as a friend on Myspace, or at the very least checkout what your Myspace will look like if you start using this theme.
In all my years of web design and development I’ve never had anything be quite as big of a pain in the ass as a Myspace layout and getting it to look the way I wanted. After three different Myspace “resets” I think I’ve finally found one that helps get you back to a mildly respectable looking page.
Download Assault’s Myspace Reset
A few things you should note when editing this file for your Myspace:
- Colors need to be changed in several places
- No # signs are used in the color hex codes
- No Javascript allowed
- No CSS shorthand, you have to type it all out
Before Copying/Pasting the Myspace Reset CSS into your profile about me area, make sure to copy the URLs to your Add to Friends, Send Message, and any of the other links contained within your Contact box because it will be hidden by the CSS. I suggest making an image and using some sort of online image map tool, to apply your add to friends and contact links as appropriate as I have done.
Elements we will be hiding
- Contact Information
- MySpace URL
- Blog Listing
- Extended Network Box
Change Images
You can download the image I have used here for my layout to get an idea of where to position your background image. You will also need to upload your background to some remote third party website such as your own web host or your Flickr account. Make sure to change the background-image: url() to the url of your background image or else it will show my background and I’m sure you don’t want that. The first code block in the reset CSS contains the background-image URL you see below:
body {
font-size: 1px; line-height: 1px; font-family: georgia, times, 'times new roman', sans-serif;
background-color:000000;
background-image:url(http://www.assaultshirts.com/images/myspace_bg.jpg);
background-attachment: none;
background-position:center center;
background-repeat:no-repeat; }
Change Colors
I recommend going through and changing the colors in one batch find/replace because the colors show up in several places and it can be hard to keep track of the sheer number of CSS colors because of the strange organisation of the Myspace Layout.
About this theme
That’s it! Change the images, colors, add your own background, and contact information image map and you’re good to go! Best part about this freebie I’m giving away is that it still abides by the Myspace terms of use and shows the advertisements, and it doesn’t have any of the stupid spam links you find on most themes. (Though it would be nice for you to at least add us as a friend)
Like this post? Bookmark it!
Email to a friend
Your message has been sent!
Please enter a valid email.
Your email failed. Try again later.
Related Posts
Most Popular3
About the Author
Tim is the co-owner of Assault, and tends to think he can party twice as hard as anyone. Follow him on twitter @assault Email this Author | All posts by tim
very useful, one question, i put a background and its fine, i just dont know how to put the image map, can you make expand a little bit this tutorial, that will be great! =) thanks!
I copied and pasted the image map code from a generator that I found online that I linked in the article. I made the image in photoshop and then imported it into the online image map editor and copied/pasted that code into my about me area.
k
k
h
[...] How to reset your Myspace page using CSS [...]
wow cool tips! just tweeted it @inkfruit
cool web site
help me fix my Myspace palese