HOW TO: Remove the annoying sidebar on the forums

[TechnoGuyRob]

EDIT: The Stylish sheet applies to stevepavlina.com in general, because I couldn't figure out how to make it work just for the forums (url and domain both didn't function properly; the former had to be applied to forums/general-introductions, forums/...). If anyone familiar with Stylish can help out on this, that would be great. It doesn't seem like the Stylish sheet interferes with the main site, so for those purposes it should be fine (but if Steve ever changes his site in the future, a conflict might, might, might arise).

EDIT 3: This hides ads. If enough people complain about an alternate version that keeps ads, or if Steve wants the ads to show, I will make an alternate version.

The sidebar is driving me nuts to the point where it severely hinders my experience of the forums. I know how to find Steve's blog and the donate button just fine, thank you very much. This is, after all, a forum for "smart people"; we don't need to have links pressed in our face that pretty much everyone on this site knows where to find.

So I made a Firefox Greasemonkey script and Stylish style that removes the sidebar and makes the forums take up the full width of the page. Personally, I prefer the Stylish add-on because, unlike Greasemonkey, the browser doesn't parse it after the page loads, meaning it integrates smoothly into the layout. So, here they are:

Pavlina Annoying Sidebar Fix for Greasemonkey*
Pavlina Annoying Sidebar Fix for Stylish**

It looks so much nicer that way!



And for anyone who wants to do it for other browsers or put it into your Firefox chrome, just use the styles:

#content { margin-left: 0px !important; }
#navigation { display: none; }

Cheers for using your screen's full real estate!

=========

* Full code:

// ==UserScript==
// @name          Pavlina Forums Sidebar Fix
// @description   Remove annoying sidebar on the Pavlina forums.
// @include       http://www.stevepavlina.com/forums/*
// @include       http://stevepavlina.com/forums/*
// ==/UserScript==

(function() {
	document.getElementById("navigation").style.display = 'none';
	document.getElementById("content").style.marginLeft = '0px';
})();

** Full code:

@-moz-document domain("stevepavlina.com")
{
   #content {
      margin-left: 0px !important;
   } 
   
   #navigation {
      display: none;
   }
}

EDIT 2:

And for you hardcore efficiency buffs, to remove the header at the top of each page, simply add the following line of code to the Greasemonkey script:

document.body.childNodes[5].style.display='none';

I'm not sure if it can be done with CSS, since the header (table) doesn't have an ID or CLASS.