Hacking MySpace

MySpace is constantly changing its web site by either adding new features or improving current features. One of its most recent changes has been the new “web 2.0″ navigation bar, which obviously an attempt to try to modernize the website and make it easier to navigate.

This has caused a lot of problems in the customizing community as Myspace have changed their navigation bar coding structure which means that the codes that used to work will now be useless.

The Codes

Now that it seems Myspace have stopped (at least for now) updating their navigation bar code I can tell you how to customize it or hide it if that is what you want to do. Due to how they have coded this navigation bar there is limited customizing techniques that can be applied to it, but I will try and cover everything you can do in this post.

Note: These codes worked perfectly on the date this article was posted, if they do not work anymore then Myspace has probably changed their coding again and these codes do not work properly anymore.

Changing the Background Color

The one part of the navigation bar that most people will want to change is the background color. This is done simply by adding this CSS to your style sheet:

<style>
div.profileWidth table td {background-color:transparent !important;}
</style>

Styling the Navigation Bar

Only changing the background color is a bit boring, so here is the code for how to change the font, text-size, link colors, etc:

<style>
.r {color search area and behind the ad}
div.profileWidth div {background-color:red !important}
.r {style the links}
div.profileWidth div ul li a {font-family:comic sans ms; font-size:12px; font-weight:bold; color:red !important;}
.r {link hover style}
div.profileWidth div ul li a:hover {color:white !important; background-color:blue !important; display:block;}
.r {remove shadow in google search box}
div.profileWidth div.clearfix {background-image:none !important;}
</style>

Hiding the Navigation Bar

The following code will hide the navigation bar, shortcuts, google search and Myspace logo. This code should only be used if you intend to create your own navigation at least so people can get back to the homepage (for example if you are making a div layout). If you are looking for a code to hide your profile so that you can start a div layout then here is a link to a fully working hide profile code that I personally keep up-to-date.

<style>
div table div form {display:none!important}
div table div select {display:none!important}
div table div .mslogo {display:none!important}
div div table div li {display:none!important}
div table div .profile {display:none!important}
table.rail {position:absolute; top:-100px !important;}
div div table div, div.clearfix a, input {display:none;}
div.clearfix table div div {display:block;}
</style>

So there we have it, all the up-to-date codes you will need to customize the new Myspace navigation menu and make your page look as good, if not better than it did before!

Related: