Wednesday, January 4, 2012

Minty Green Compromise

First published on MySpace blog - 14/11/11

Well, they finally did it, the crazy fools. Cue scream of anguish like the moment when Charlie Heston found the Statue of Liberty sticking out of the beach. They've f***ed up the MySpace homepage yet again and there's no turning back.

This is what greets me when I first log in. Yummy! At least the Ad-BlockPlus is still doing an admirable job!

In a rather underhand and sleazy manner, the method that MySpace has chosen to "persuade" we UK artists to "upgrade" to the new homepage is... to DISABLE THE "CHANGE IT BACK" BUTTON.

I have tried the "new" page several times previously and had decided against it. No notifications module; only two comments on each stream posting; the page defaults to the useless "stats" display instead of the stream; you have to go through two or three clickings just to see your own stream; the fact that the page is even more jam-packed with useless "Other Peoples Stuff"; ...and who the hell needs a profile comments box on their homepage? I could go on (and probably will!)

Several clicks of the mouse and you eventually get to where you want to be. Notice the taunting "Change it back" button.

So any attempt to "FIX" the mess with our old friend STYLISH is, at the moment, a compromise at best. My code is a little cobbled together at the last minute (from previous projects and versions) and somewhat inelegant. But it kinda works... I would imagine it could be modified to work with the "new" civilians page that they've given to our US friends, as the layouts are similar.

Away with the comments... away with all that guff in your face. If you really want to see list of your own stuff then click on a menu, for gawd's sake!

Here's the code as she is writ...

As usual, we start with the W3 compliance bit and the bit that says what pages your script applies to. This first section applies "general" settings across the whole MySpace domain - all the stuff to remove advertising space, the extra rubbish that they put on your blogs and the ugly black footer. It's pretty much unchanged from the published "Minty Blue Minimalism" script:-

@namespace url(;
@-moz-document domain(

ul.streamViews {display: none !important;}
ul.footertools {display: none !important;}
.commentContainer {font-size:12px!important; color:#000000!important;}
article.RecommendationsModule {display: none !important;}
article.bestOfTheFixModule {display: none !important;}
article.bulletinsModule {display: none !important;}
article.manageMyStuffModule {display: none !important;}
article.myVisitorsModule {display: none !important;}
article.bandArtistDashboardModule {display: none !important;}
article.upcomingShowsModule {display: none !important;}
article.friendSpaceModule {display: none !important;}

div.labeled_ad, ad_container.medrec2, ad_container.adspecial1 {display: none !important;}
div#tkn_leaderboard, article.googleAdSenseModule {display: none !important;}
div.module.module3.columnModule1.even.RecommendationsModule.draggable {display: none !important;} {display: none !important;}

div.linksColumn {display: none !important;}
article#module-2.module.module2.columnModule0.odd.InfoGraphicModule {display: none !important;}
div.infographic {display: none !important;}
div.splashMedia {display: none !important;}
div.footershim {display: none !important;}
div.musicColumn {display: none !important;}
div.splashSignUp {display: none !important;}
article#module-3.module.module3.columnModule0.odd.SignUpV2Module.draggable {display: none !important;}
div.curatorsColumn {display: none !important;}
div.topicsColumn {display: none !important;}
section#col2_0.column.column0.columnPath2_0.columnDepth1.firstColumn.lastColumn.allowDrop {display: none !important;} {background: transparent!important;}

li.checkerLightBG {display: none !important;}
div.alertsRequests {display: none !important;}
div.pageFooter {display: none !important;}
div.moduleFooter {display: none !important;}
div.gracefulinjection {display: none !important;}
nav.gearLinks {float:left!important;}
div.shareButtonControl {display: none !important;}

div.module.module4.columnModule1.even.RecommendationsModule.draggable {display: none !important;}
div.userActions {float:right!important;}
.msProfileTextLink {font-weight:bold!important;}

The second section applies changes just to the homepage:-

@-moz-document url-prefix('')

First of all, a nice background tile or picture:

.userHome {background: url("")!important;}

We start to chuck away some of the stuff that doesn't really work anymore:

.streamTabs {display:none!important;}
div.sysMessage {display:none!important;}
div.thread {display:none!important;}
.column.column2.columnPath1_2.columnDepth1.lastColumn.allowDrop {display:none!important;}

Then we can start to size and colour in the more useful stuff:

h3.moduleHead {color:#008080!important; font-size:20px!important;}
div.layout, div.wrap, content.moduleBody {background-color:#ffffff!important; border:none!important; box-shadow:none!important;}

Hides all those useless list of your own stuff on the "stats" screen:

div.playitem {display:none!important;} {background-color:#ddeeee!important; border-radius:0px!important;}

.column.column1.columnPath1_1.columnDepth1.allowDrop {width:700px!important; background-color:#ffffff!important; border:none!important; box-shadow:none!important;}

span.msProfileLink {background-color:#f8f8f8!important; border-radius:0px!important; padding-top:20px!important; padding-bottom:10px!important; box-shadow:none!important;}
div.wrapper {padding:6px!important;}

This hides that yellow thing for swapping between versions of the homepage. We all know THAT doesn't work!

#promoView {display:none!important;}

You've been on MySpace for how long? Then why do you need a stupid "To Do" list?

div.todohead, ul.todolist {display:none!important;}

Colouring in some boxes and adding a spiffy 3D shadow effect to the stream...

div.minimized, div.expanded, textarea.status, div.inputs {background-color:#ffffff!important; border-radius:0px!important;}
.activityStreamModule {background-color:#ddeeee!important; padding:20px!important; border-radius:0px!important; box-shadow:0 0 6px rgba(0,0,34,0.5)!important;} {background-color:#ddeeee!important;}
.commentContainer {width:620px!important; padding:10px!important; background-color:#bbcccc!important; border-radius:0px!important; box-shadow:0 0 6px rgba(0,0,34,0.5)!important;}
div.comment.expanded {background-color:#bbcccc!important;}
div.streamCategories {font-size:10px!important; color:#ffffff!important; background-color:#008080!important; border-radius:0px!important; position:relative!important; left:610px!important;}

No more F***book nags and adverts (this is a throwback from an earlier script. It might not apply anymore, but if there's a chance that it's still keeping F***book off my homepage, I'm holding on to it just in case!):

div.glue-dialog.FBMP.large {display:none!important;}
div.glue-overlay {display:none!important;}
article.module.module6.columnModule2.odd.AdContainerModule.draggable {display:none!important;}
article#module-6.module.module1.columnModule0.odd.adFbPromoModule.draggable {display:none!important;}
li.recent {display: none !important;}

Finally a little something to colour the hyperlinks to match your scheme of things:

a,a:link,a:visited {text-decoration:none!important; color:#008080!important;}
a:hover,a:active {color:#000000!important; outline:0!important; text-decoration:underline!important;}

(Don't forget the final closing bracket!)

Minty Green Sparseness. I just happened to pick those colours, because they match the profile page itself. Note the familiar bootprints as page background. Note too the snazzy 3D effect on the stream comments container.

I dare say I will be honing and tidying up the code a little more in the ensuing weeks... but for now, let's see what you can make of that, kids!


Peter Kelly... OMG - so far so good for me - I am still the old page. 

PP... What ever you do, Peter, don't be tempted to press that button and "try" the new one!

No comments:

Post a Comment