SharePoint, ASP.

NET and more

all my development tips and tricks

Home

Hide left navigation panel without changing Master Page

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 M aster 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.

This entry was posted on Wednesday, June 20th, 2007 at 2:45 pm and is filed under SharePoint. You can follow any responses to
this entry through the RSS 2.0 feed. You can skip to the end and leave a response. Pinging is currently not allowed.

8 Responses to “Hide left navigation panel without changing Master Page”

1. RubyRuby says:
M arch 13, 2009 at 7:47 am

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.

Reply
2. Dan says:
June 12, 2009 at 6:49 am

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?

Reply
3. eman says:
 January 3, 2010 at 6:49 am

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

Reply
4. eman says:
February 4, 2010 at 2:09 pm

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.

Reply
5. fisk33 says:
M arch 18, 2010 at 12:51 pm

brilliant! worked like a charm. Thanks for help.

Reply
6. eman says:
M arch 26, 2010 at 12:03 am

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;}

Reply
7. eman says:
 M arch 26, 2010 at 12:11 am

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.

Reply
8. eman says:
M arch 27, 2010 at 11:41 am

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 = '';
}
}

Reply

Leave a Reply

Name

Mail (will not be published)

Website
Submit Comment

Notify me of follow-up comments via email.

Send me site updates

Search

Categories
.NET (2)
ASP.NET (22)
Ajax (2)
SalesLogix (11)
SharePoint (42)
BDC (4)
Document library (15)
Events (4)
Search (7)
Security (7)
Webpart (6)
SQL (12)
Sys Admin (2)
Uncategorized (4)

Archives
July 2010 (2)
M ay 2010 (1)
April 2010 (1)
February 2010 (4)
October 2009 (1)
August 2009 (1)
July 2009 (3)
June 2009 (2)
M ay 2009 (3)
 April 2009 (1)
M arch 2009 (4)
February 2009 (5)
January 2009 (5)
December 2008 (5)
November 2008 (2)
October 2008 (2)
September 2008 (1)
August 2008 (2)
July 2008 (2)
M ay 2008 (2)
April 2008 (4)
M arch 2008 (4)
February 2008 (2)
January 2008 (2)
December 2007 (8)
November 2007 (5)
September 2007 (1)
August 2007 (4)
July 2007 (7)
June 2007 (3)
M ay 2007 (1)

Tags
Ajax ASP.NET Audiences BDC checkin checkout crawl crawling Crystal Report event indexing
javascript LINQ ListView menu optimization PDF Performance permission publish recy cle bin scope Search
Security SQL upload Webpart web part _files

Recent Comments
Scott Robertson on Free up Database space after d…
Anonymous on Automatically checkin files af…
Issues after restori… on Error event ID 6398 and 6482 …
Rahul on Webpart and AJAX – trick…
Scott on Send To->Email a Link doesn…

Theme Contempt by Vault9.

Blog at WordPress.com.