How To Hide Left Display Panel in SharePoint 2010 and 2007

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.  There is no way out of the box to hide the Quick Launch and the Tree View navigation in SharePoint 2010 or 2007

The easiest way is to use the old school CEWP trick that worked even back in 2003, just add a the Web Part that now has the name Content Editor and add the following text in the HTML Source mode:

<style type="text/css">

/*--Hide Quick Launch for 2007 -–*/

.ms-navframe, .leftNavSpacer { display:none; }

/*--Hide Quick Launch for 2010 -–*/

#s4-leftpanel{display:none}

.s4-ca{margin-left:0px}

</style>

The Master page that includes this navigation control does not longer have a table structure as it had in SharePoint 2007, which gives a cleaner and a well-formed markup HTML. So with the code above, I am including both CSS styles so that no matter which masterpage you use, the page will still hide the left nav.

In SharePoint 2010, the DIV elements in the master are floated to each other and have their positions defined by margins or a width, this is why I had to set the margin to zero for the s4-ca class, the wrapper for the content in the page. The value for the left panel ID can be set to not be displayed.

clip_image001

2 thoughts on “How To Hide Left Display Panel in SharePoint 2010 and 2007”

Leave a Reply