Corner
Tel 0141 416 1040

E-mail hello@fuzzylime.co.uk

the little green blog

A Facebook fix - get the 'old' style of home page back!


Facebook has today rolled out one of their changes they do every so often. This time round, they've changed the home page, making the text much smaller than it was before.

Facebook homepageThey've also changed the way the page displays, so a user's status update or link now shows on a new line, rather than straight after their name – getting rid of the fun of "is"-type statuses that still remind us all of the old days of FB!

Luckily, because it's such a superficial change, you can switch it back again. We've been doing some research this morning and we've come up with ways to fix it for Internet Explorer, Firefox, Google Chrome, Safari and Opera users – which will, hopefully, be most of you!

So just find your browser below and follow our simple instructions to return Facebook to its former glory (ie how it was yesterday). Enjoy.

UPDATE: Thanks to Eternald in the comments for suggesting a change to make more messages appear in the old way.

For Internet Explorer

As always, this comes with a health warning – IE doesn't allow you to apply styles to only one site, so there's a (slim) chance that these styles could affect other sites. We've done our best to minimise the chance of this happening though. We've tested this on IE8 – it should work the same on other versions, though. 1/ Download this file and save it somewhere you won't accidentally delete it. 2/ Go into your "Tools" menu and choose "Internet Options". 3/ On the "General" tab, click "Accessibility". 4/ Tick "Format documents using my style sheet" and find the file you downloaded. 5/ Hit OK twice and you're done!

For Firefox

1/ Install the Stylish extension and restart Firefox, then head to Facebook. 2/ Right-click on the new "S" icon in the bottom-right corner of your browser and hit "Write new style", then "for facebook.com". 3/ In between the curvy { } brackets, paste in these two lines:
div.actorName { font-size: 13px!important; display: inline!important; } .uiStream .uiStreamMessage { font-size: 13px!important; line-height: 16px!important; }
4/ Give your style a name ("Nicer FB" is what I've gone with) and hit "Save". 5/ You're done! Old-style Facebook returns.

For Google Chrome

1/ Install the Personalised Web extension. 2/ Head into the "Window" menu and choose "Extensions", then hit "Options" next to Personalised Web. 3/ Hit "Add new rule", give it a name (like "Nicer FB") and set the "Match URLs" to ^http(s?)://www.facebook.com - that wee ^ symbol at the start is important, so make sure it's not lost. 4/ In the "Add CSS" box, paste in this code:
div.actorName { font-size: 13px!important; display: inline!important; } .uiStream .uiStreamMessage { font-size: 13px!important; line-height: 16px!important; }
5/ Hit "Save" and you're done!

For Safari

1/ Download the User CSS extension and double-click to install. 2/ Head to Facebook, right-click and choose "Manage user CSS". 3/ Tick the "Enabled" box, give your style a name (like "Nicer FB") and in the domains box enter http://*.facebook.com/* 4/ In the "Styles" box, paste in this code:
div.actorName { font-size: 13px!important; display: inline!important; } .uiStream .uiStreamMessage { font-size: 13px!important; line-height: 16px!important; }
5/ Hit "Save" and you're done! (Incidentally, you can only do this if you're running Safari 5, the latest version, which supports extensions. If you aren't, you'll need to upgrade first.)

For Opera

1/ Download this file and save it somewhere you won't accidentally delete it. 2/ Head to Facebook in your browser, right-click and choose "Edit site preferences". 3/ Choose "Display" at the top, click the "Choose" button next to the "My style sheet" box and choose the file you just downloaded. 4/ Hit OK and reload Facebook. 5/ You're done!

Simple, eh?

We hope our handy guides are of use to you. If you have any suggestions on how to improve them, leave us a comment below. As a shameless plug, if you're looking for people to build you a nice website (and not change font sizes for no reason), we reckon fuzzylime are probably the people for the job. Get in touch with us to discuss what we could do for you!

Comments: 13 (Add)

Your name:
Message:
Enter : [?]
 
Lisa on December 30 2010 at 22:45

Tied to use this with both firefox

Z on December 8 2010 at 01:11

Hello and thanks for the fix! Any chance this will get updated for the new facebook profile? My activities font size is as big as my posts!

David at fuzzylime on November 5 2010 at 09:37

No problem - I've clarified the instructions to make this point clearer!

Abi Shepherd on November 5 2010 at 09:36

Yay its worked. Thanks. I didn't realise you have to be on the Facebook page when you do it! dur!

David at fuzzylime on November 5 2010 at 08:57

Abi, if you go to Facebook, right-click on the wee "S" icon that appears in the bottom-right corner of Firefox, choose "Write new style" and then choose "for facebook.com" you're there.

Abi Shepherd on November 5 2010 at 08:55

Im trying to do this for Firefox but the instructions dont entirely work. where am i meant to write for facebook.com

David at fuzzylime on November 5 2010 at 08:18

No problem - glad to help! I also found Better Facebook very overwhelming - sure, you can turn everything off, but that just seemed a bit pointless to me :)

Katie on November 5 2010 at 08:00

THANK YOU!!!!! I did this on Chrome. It was so simple, and worked great. I had tried the Better Facebook extension, but it changed things too much. This worked so much better.

paul - thetwitterking :) on November 4 2010 at 18:35

Awesome post .... thank you!!!

David at fuzzylime on November 3 2010 at 14:27

Thanks for the tip Eternald - I've updated the code as suggested, it means that items when multiple people post the same link aren't quite showing correctly (as they were always smaller) but that's probably no bad thing!

eternalD on November 3 2010 at 13:55

Thanks for this.

I'd like to suggest to use this instead for the second css rule. It will fix all the message types in the frontpage feed.

.uiStream .uiStreamMessage { font-size: 13px!important; line-height: 16px!important; }

David at fuzzylime on November 3 2010 at 11:53

Hi, and you're welcome! The CSS doesn't change the colour of the text at the moment - it's possible Facebook themselves have, if I can confirm this I'll update the CSS as appropriate.

Squillace on November 3 2010 at 11:52

Hi, I would like to say THANK YOU VERY MUCH for this fix. However, I'm pretty sure that color text is #333333 and not black.

This site uses cookies. By continuing to browse the site you are agreeing to our use of cookies. Find out more :: Don't show me this again X