Some MR Neatness in The Works

[Josh]

I've got a small little project going. I've been tinkering with a local style-override on MR to give the site a little more "zing" as I stare at it all day.

Here's a quick sneak peak.

I'll release the final version with instructions on how to use it once it is completed :)

[jaydub]

Looks nice!

A nice addition to MacRumors would be a "previously participated topics" link. :o

[neocell]

How is that different from the current settings, besides your coloured background (or is it the desktop showing through)?

[Applespider]

How is that different from the current settings, besides your coloured background (or is it the desktop showing through)?

It looks like an OS X theme overlaid in the main area. So the white around the edges becomes the desktop, the grey becomes brushed metal etc

And subscribed threads (assuming you subscribe to them automatically as you post) can be seen under Quick Links already

[jaydub]

And subscribed threads (assuming you subscribe to them automatically as you post) can be seen under Quick Links already
somehow I missed that, thank you.

[ham_man]

Looks nice, so far... :)

[cleanup]

I've got a small little project going. I've been tinkering with a local style-override on MR to give the site a little more "zing" as I stare at it all day.

Here's a quick sneak peak.

I'll release the final version with instructions on how to use it once it is completed :)

Is that... Windows? I note the lack of Quartz text rendering.

[mad jew]

How cool would it be if blank space on sites in browsers could be made transparent. :cool:

[Abstract]

Nice.

This site design is getting kinda boring anyway. Those tab things near the top right side (ie: the ones that say "Mac Rumors, Page 2, Buyer's Guide," etc) are like the ones on Apple's own site, but even that site design is getting a little bit old.

[Josh]

Nice.

This site design is getting kinda boring anyway. Those tab things near the top right side (ie: the ones that say "Mac Rumors, Page 2, Buyer's Guide," etc) are like the ones on Apple's own site, but even that site design is getting a little bit old.

Thanks!

I may or may not completey redo the header design for this. I'd really like to, but it depends on how much free time I get at work :p

Everything else is very much more "Mac-like" than current, and hhopefully I can finish it up in the next couple days.

[jessica.]

I like it because I like the contrast. But I also like this style. It is one of the message boards that I have not grown tired of, is easy on the eyes, and works well when loading on my pocket PC.

[dmw007]

Looks cool Josh! :)

[dubbz]

Looks nice :) Can't say much else without seeing the whole thing.

[Oryan]

Looks cool Josh! :)
Agreed. I'm looking forward to trying it out. :)

[jelloshotsrule]

i would have no idea how to even start going about doing this. you are a giant nerd.

[Josh]

i would have no idea how to even start going about doing this. you are a giant nerd.

Ah, I'm only about 5'10 :p

Here's another preview of the post view (hope the posters don't mind their posts being re-posted lol).

[PlaceofDis]

very nice, i like it. i'll give it a try when its done. :D

[jelloshotsrule]

i hope the installation is easy enough for a jackass like me to figure it out, looks cool.

[netdog]

What a great thing to do. Make Josh a DemiGod.

[Josh]

i hope the installation is easy enough for a jackass like me to figure it out, looks cool.

Which browser are you using? I can tell you it's easy as pie on Firefox.

The style will work in every browser, but I do not know if all browsers are capable of style over-riding on a per-site basis. I'll have to check safari once I get home.

[aquajet]

Looking good Josh. :)

[jelloshotsrule]

Which browser are you using? I can tell you it's easy as pie on Firefox.

The style will work in every browser, but I do not know if all browsers are capable of style over-riding on a per-site basis. I'll have to check safari once I get home.

i use safari at home. IE at work because i can't install anything else.

hopefully safari ends up being easy too

[Josh]

Unfortunately I cannot do much to the header/tabs/etc without being able to edit the template itself, but did as much as I could.

Here's a front view of the forums. I should have it finished up in a little bit.

[4God]

Good job dude, I like the contrast in the header.

[XNine]

That IS pretty spiffy. Nice work. Would we be able to customize your layout for our own needs? Say I want more of a new brush metal look on some things, can I modify it?

[Josh]

That IS pretty spiffy. Nice work. Would we be able to customize your layout for our own needs? Say I want more of a new brush metal look on some things, can I modify it?

Yep - it's all done through CSS, and you can edit it any way you like.

Well, it's a javascript file, but the same CSS is in there so it is easy to figure out.

[XNine]

Yep - it's all done through CSS, and you can edit it any way you like.

Well, it's a javascript file, but the same CSS is in there so it is easy to figure out.

Sexy. Very, very sexy.

[Josh]

Ok - here is the style with info on how to use it.

Please note that due to limitations of not being able to alter that actual template of MR, I could only change so much. Because of this, some things could not be altered (navigation tabs, etc). Additionally, some links at the bottom could not be changed to "match."

This style is also _only_ optimized for the forums. Other sections of the MR site (main page, page 2, buyers guide, etc) will not be affected by the changes if you use this method.(This can be done, however - let me know if you're interested)

How to put it in action
The method I use requires FireFox. If you use another browser, you still may be able to specify a stylesheet to be used - I will check Safari in more detail once I get home.

Step 1) - Install the greasemonkey (http://greasemonkey.mozdev.org/) addon for firefox (click the install link on the page it brings you to, and it will install instantly)

Step 2 - Restart firefox and come back to this post.

Step 3 - Right click (control click) this link (http://www.joshuaestevens.com/files/macrumors.user.js) and select "Install User Script" - you should receive a comfirmation, click OK.

Browse to a new place on the forums or hit refresh to make the change take effect. Enjoy :)

Please let me know if you have any trouble getting this to work, or notice any problems.

[2nyRiggz]

I like it but firefox and I can not get along...oh well.


Bless

[Xander562]

Wha wha whaaaa..... please keep going for the entire site, this looks way cool.

[Macmaniac]

Looks really cool. Does it work in Safari?

[garfield2002]

Your instructions worked great. Wow I really like this look. :)

[Josh]

Wha wha whaaaa..... please keep going for the entire site, this looks way cool.
Thanks - I'll try tomorrow if I get the time. It's easy to enable it and it works with 90% of the other pages' content, but there are some minor things that need to be adjusted.

Looks really cool. Does it work in Safari?
The method I posted will not, since it requires greasemonkey. However, Safari may be capable of doing it through another method, which I'll be searching for once I get home. I'll post any info/instructions I can with that as well.

Your instructions worked great. Wow I really like this look. :)

Thanks - glad you like it :D

[pknz]

Looks good. But I only switch to Firefox when Safari starts to jerk my chain.

[skoker]

Quick comment: I haven't installed it yet (still not ready to dump Safari) but in your one screenshot you spelled 'discussion' wrong.


Looks amazing though.

[Phat_Pat]

dude this is awesome

[Josh]

Quick comment: I haven't installed it yet (still not ready to dump Safari) but in your one screenshot you spelled 'discussion' wrong.


Looks amazing though.

LOL! I guesss I did.

Thanks for pointing that out - I'll fix it and put up the new one soon :o

Edit: I just wanted to add that it can be done in Safari with a very similar method. I will post the instructions with the fixed version.

[supremedesigner]

Unfortunately I cannot do much to the header/tabs/etc without being able to edit the template itself, but did as much as I could.

Here's a front view of the forums. I should have it finished up in a little bit.

That is awesome! Is there any other way to add more themes on this MR? I'm curious. Thanks!

[amacgenius]

LOL! I guesss I did.

Thanks for pointing that out - I'll fix it and put up the new one soon :o

Edit: I just wanted to add that it can be done in Safari with a very similar method. I will post the instructions with the fixed version.

Any update on when us Safari faithful can use this?

[trainguy77]

I think this is how you would do it: http://www.hicksdesign.co.uk/journal/skinning-sites-in-safari-with-pithhelmet However I don't use pithhelmet so I don't know if that would work. It made safari unstable.:(

[Josh]

I think this is how you would do it: http://www.hicksdesign.co.uk/journal/skinning-sites-in-safari-with-pithhelmet However I don't use pithhelmet so I don't know if that would work. It made safari unstable.:(

Yeah, PithHelmet was the only way I could find for Safari as well.

If anyone is using this and would like the stylesheet, let me know and I can post it.

[Rower_CPU]

SafariStand (http://hetima.com/safari/stand-e.html) also allows you to specify your own stylesheets in Safari. I've been using it for a while with no issues.

[trainguy77]

I tried creating this out of the javascript file but it did not work I am not sure why. Its probably something obvious.:( Never have been very experienced with CSS/html

I can't upload .css so I changed it too .txt

[Josh]

I tried creating this out of the javascript file but it did not work I am not sure why. Its probably something obvious.:( Never have been very experienced with CSS/html

I can't upload .css so I changed it too .txt

Looked fine to me. What method did you use in trying to use it with safari?

[trainguy77]

Looked fine to me. What method did you use in trying to use it with safari?
I used SafariStand.

[Killyp]

woooh! this is über cool!!! :cool:

[wmmk]

cool! ill wait for the safari instructions to be more clear cut. i dunno much CSS, but could i make all fonts look like helvectia neue ultralight and make the gray stuff look like brushed metal? thanks. looks great!:)

[dextertangocci]

I love it:) :) ;) :cool: :D

[bigandy]

getting nothing from SafariStand or PithHelmet with either the CSS or the JS files.

hmmm... loads them in but refuses to actually apply the style... :(

[technicolor]

This is nice!

The only issue is it seems the page loads slower....or maybe thats just my comp/connection

[bigandy]

i went and created a PithHelmet rule and still.... nowt.

http://www.pixellation.co.uk/misc/httpforums.macrumors.com.phr

Anything wrong with that?

[blueflame]

looks great, i wish the site would adopt this
andreas

[jared_kipe]

I vote for this to become the new official look to macrumors. None of this scripting stuff, if everyone likes it I think we should all use it.

[trainguy77]

getting nothing from SafariStand or PithHelmet with either the CSS or the JS files.

hmmm... loads them in but refuses to actually apply the style... :(
Yeah I still can't get it to work. I makes a couple changes but only a few.(makes some text with a grey background, changes one icon) I have tried in also in the advanced tab of safari and it still does not work. I know that would screw all the others sites but just for testing that still does not work.

[bigandy]

Yeah I still can't get it to work. I makes a couple changes but only a few.(makes some text with a grey background, changes one icon) I have tried in also in the advanced tab of safari and it still does not work. I know that would screw all the others sites but just for testing that still does not work.

excatly what i'm getting too.

i installed it using greasemonkey/firefox and it's soooo easy.

but i want it to work in safari :(

[Ensoniq]

If you take a look in the User CP here in the forums, and go into "Edit Options", you'll see a choice at the very bottom that lets you change the skin of the entire forum here. (The only other choice is a smaller font version.)

Rather than this external "hack" of the site (which is very cool by the way), why not write to the MacRumors forum heads, and see if they are willing to give you the actual template for the forums.

You could then modify that and turn your changes into a real "skin" for the site that they could install on their side and every single user here (regardless of browser) could enjoy your changes?

Just an idea...

[Josh]

If you take a look in the User CP here in the forums, and go into "Edit Options", you'll see a choice at the very bottom that lets you change the skin of the entire forum here. (The only other choice is a smaller font version.)

Rather than this external "hack" of the site (which is very cool by the way), why not write to the MacRumors forum heads, and see if they are willing to give you the actual template for the forums.

You could then modify that and turn your changes into a real "skin" for the site that they could install on their side and every single user here (regardless of browser) could enjoy your changes?

Just an idea...

Thats a really good idea - being able to edit the actual template would allow me to make very radical changes which would be really neat.

The only thing that makes me hesitate in contacting the admin(s) is that there are a lot of "designers" on this site, and if the admin(s) let me make a template, eleventy billion other people would want to make one too. Another thing is that with more skins comes more work/responsibility. Any site-wide changes (new ad scripts, etc) would have to be made for one more skin. Three skins isn't overwhelming, but I imagine it is a concern of theirs.

What I think would be a good solution is if the MR team held a template design competition, where the entrants would design a complete VB template and the community would then vote on the best. The best one would either get added to the list, or (better, IMO) become the official default skin.

That way, we'd get some serious competition going and I think the end result would be incredible no matter who won. :)

[michaelrjohnson]

Josh-

I really like the skin. My only thought is that the background isn't handled very gracefully on the lower portion. You have the Aqua desktop image fade to a dark blue, which, in my opinion, is very harsh when you get to the lower posts on a page. Is there any way that this blue could be lighter, more in the same contrast range as the posts?

Just my opinion, but GREAT work. Thanks!

[wmmk]

wow, just got back from a 4 week trip. has anyone gotten this working on safari without compromising stability?

[cwedl]

Fantastic! Coming to this site alot, its nice sometimes for a change!

[wmmk]

Yeah, PithHelmet was the only way I could find for Safari as well.

If anyone is using this and would like the stylesheet, let me know and I can post it.
wow, if you could post the correct sytlesheet for PithHelmet, that'd be great!
Thanks again!


Edit: I tried using trainguy77's stylesheet with pithhelmet and all i got was a gray border around all bold text. should i save all related images locally?

[sjpetry]

Thats a really good idea - being able to edit the actual template would allow me to make very radical changes which would be really neat.

The only thing that makes me hesitate in contacting the admin(s) is that there are a lot of "designers" on this site, and if the admin(s) let me make a template, eleventy billion other people would want to make one too. Another thing is that with more skins comes more work/responsibility. Any site-wide changes (new ad scripts, etc) would have to be made for one more skin. Three skins isn't overwhelming, but I imagine it is a concern of theirs.

What I think would be a good solution is if the MR team held a template design competition, where the entrants would design a complete VB template and the community would then vote on the best. The best one would either get added to the list, or (better, IMO) become the official default skin.

That way, we'd get some serious competition going and I think the end result would be incredible no matter who won. :)

That gets my vote. :)

[monke]

Also, for those who want to know, you can use this in the new Forum Spy.


Just add the URL: http://spy.macrumors.com/ into the included pages section :)

[Lixivial]

It works in Safari using SafariStand. I realize that's been said before, but no one seemed to follow up with instructions so here's how I did it:

Save the attached "mr.txt" to ~/Library/Safari/Stand/UserStyleSheets/mr.css [NOTE: you will have to rename the attached mr.txt to mr.css because MR does not accept .css attachments]

Enable "Site Alteration" in the Stand menu

Go to SafariStand Settings in the Stand menu and under the "Site Alteration" click the "Add"

Select the newly created "forums.macrumors.com" site and, on the right hand side, click the "Alter" checkbox beside "User StyleSheet Location:" and then drop down and select "mr.css"

EDIT: The MacRumors: Forums header image has a typo in it... discussion does not have two "c"s. See the screenshot that I originally omitted.

[skoker]

Quick comment: I haven't installed it yet (still not ready to dump Safari) but in your one screenshot you spelled 'discussion' wrong.


Looks amazing though.


EDIT: The MacRumors: Forums header image has a typo in it... discussion does not have two "c"s. See the screenshot that I originally omitted.

thanks for noticing.

[wmmk]

It works in Safari using SafariStand. I realize that's been said before, but no one seemed to follow up with instructions so here's how I did it:

Save the attached "mr.txt" to ~/Library/Safari/Stand/UserStyleSheets/mr.css [NOTE: you will have to rename the attached mr.txt to mr.css because MR does not accept .css attachments]

Enable "Site Alteration" in the Stand menu

Go to SafariStand Settings in the Stand menu and under the "Site Alteration" click the "Add"

Select the newly created "forums.macrumors.com" site and, on the right hand side, click the "Alter" checkbox beside "User StyleSheet Location:" and then drop down and select "mr.css"

EDIT: The MacRumors: Forums header image has a typo in it... discussion does not have two "c"s. See the screenshot that I originally omitted.
still doesn't work for me:confused:

[skoker]

The vBul update kinda broke this for me, any chance you could find a few minutes to update it?

Please and thank-you.

[MacNut]

The vBul update kinda broke this for me, any chance you could find a few minutes to update it?

Please and thank-you.Is it possible for Arn to make that an official skin.

[wmmk]

just switched to FF and the first thing I did was install this. it's cool, but at first, it seems to load the default MR images. would a restart help? also, the top aqua blue background is nice, but the bottom is just solid blue. any way to change this? thanks:)

[Killyp]

Working perfectly in Safari now! Thanks!! :D

[wmmk]

Working perfectly in Safari now! Thanks!! :D
how exactly did you get this working?

[tominated]

please make this work for the whole site!
btw: if possible, i would change the tops of the posts to look like the top of an aqua window, and please chage the buttons so they look more apple like. other than that, it is uber cool

[monke]

They can't really do anything with the forum software.

Only the header and background. Thats about it.

[AmbitiousLemon]

They can't really do anything with the forum software.

Only the header and background. Thats about it.

actually vbulletin is fully themeable. we can change anything and everything.