The left navigation bar makes the page looks very “SharePoint”. And, some valuable space is wasted under it. If you don’t want to customize the Master page (or want to keep the left nav panel in the rest of the site), you can just hide it on the home page. Insert a Content Editor webpart, and edit the source by clicking the “Source Editor…” button, and enter this:
<style>.ms-navframe{ display:none; }</style>
That’s right, this is just to override the default style for that section.
Since this web part is just added to the home page, it doesn’t hide the left nav penal for other pages.
Of course you don’t want to show this web part, choose the chrome type to be “None” then its title will not show after you publish it.
SharePoint, ASP.NET and more 
Acutally, I just tried it on a custom page in my collection and it works just fine. Thanks for posting this. I’ve had trouble finding a simple solution until now. You saved me much time.
I noticed this only works on pages where I have a data list that has been converted to an XSLT data view. Do you know why this might be?
I second RubyRuby
This is fantastic. I’m sure many people in my company would bake a cake if I get rid of this navigation pain, (sorry, I mean, pane) for them 🙂
Yes, this is indeed nice, but I would rather have a toggle button to Show/hide the left navigation pane.
Sorry but I am a script ignorant.
Any help would be greatly appreciated.
brilliant! worked like a charm. Thanks for help.
This can be even more interesting.
This script provides a toggle button to hide/show the left navigation panel.
function toggle(flag) {
var el = document.getElementById(“LeftNavigationAreaCell”);
if ( el.style.display != ‘none’ ) {
el.style.display = ‘none’;
}
else {
el.style.display = ”;
}
}
AND, if the upper title bar / Logo is also bothering you in some pages or document libraries, you can add this script, to hide it:
.ms-globalTitleArea {
display:none}
.ms-navframe{display:none;}
Sorry, something went wrong when I pasted the toggle script. Let’s try again:
code:
function toggle(flag) {
var el = document.getElementById(“LeftNavigationAreaCell”);
if ( el.style.display != ‘none’ ) {
el.style.display = ‘none’;
}
else {
el.style.display = ”;
}
}
end code.
I think I got it now:
function toggle(flag) {
var el = document.getElementById(“LeftNavigationAreaCell”);
if ( el.style.display != ‘none’ ) {
el.style.display = ‘none’;
}
else {
el.style.display = ”;
}
}
Hi,
I have copied and pasted the below code in Content Editor webpart but its not working.
can you please help. Thanks in advance
function toggle(flag) {
var el = document.getElementById(“LeftNavigationAreaCell”);
if ( el.style.display != ‘none’ ) {
el.style.display = ‘none’;
}
else {
el.style.display = ”;
}
}
It worked.. 🙂 Thanks a TON!!!!
there is another solution
Master.FindControl("PlaceHolderLeftNavBar").Visible = false;Hi Priya, how did you go about calling the function?.
I just copied the function into a content editor and nothing happened. Any help with getting the Navigation to toggle will be appreciated.
Thanks.
Thanks! The pane is hidden on the left. Now how do I make my main area start on the left side of the page? Now I just have a big blank area on the left?
Thanks.
@Johnny
Try to use SharePoint Designer, which is now downloadable for free from Microsoft. Use it carefully though.
With SharePoint Designer you have more power to manipulate your page. Just make sure to have a backup copy, in case you make a mistake. Luckily, if you have not closed SharePoint Designer, you can come back and undo even after you have saved/published your changes.
Thank you for the easy to follow instructions — I love when things work…like they are supposed to.
I have a question i added a content editor web part on my sharepoint portal homepage, and I entered this code:
.ms-navframe
{
display:none;
}
howwever after this i choosse to make the content editor web part invisible, so now i no longer have access to any quick launch options, which you need to modify anything on the portal home page….what should i Do?
Here is a pre-made solution – http://vishalseth.com/post/2011/07/22/Removing-Sharepoint-Top-and-Left-Navigation-Using-URL-Query-String-Parameter.aspx
Hi,
I am looking for the solution, to hide the left panel throughout, but only show in the documents..
I simple use the css (display:none to hide the left panel).
I can’t get this to work… what am I doing wrong… I am looking for a solution that allows me to let a user show or hide web parts based on what they want to do. Any ideas?
This doesn’t work for me. I am using SharePoint 2007. It is a team site.
Brilliant..quick and easy resolution…
that is a sweet, simple solution! thanks!!