How to hide the Quick Launch Bar and recycle bin using a Content Editor Web Part

Found this tip in an obscure place but felt it was worthy to show and explain in more detail. If you want to hide the Quick Launch Bar on a SharePoint page/site and would prefer not to customize pages in SharePoint Designer (i.e. this is quick and easy and tool free), this tip is for you.

In addition, if you were to export the Content Editor Web Part (CEWP) that was created and then add it to your web part gallery, you could then simply ‘plug in, the Quick Launch Bar off switch’ by adding the web part to dashboards, as needed.

*** SharePoint 2010 Update: ***

In SharePoint 2010, this is done a little differently. These posts walk you through it (I prefer adding a Web Part to my Gallery so I can reuse it easily but when not available due to rights, adding in a CEWP works great too – see the 2nd post as it is very nicely laid out).

Reference Links:

• http://chrisstahl.wordpress.com/2010/03/15/hide-the-quick-launch-in-sharepoint-2010/
• http://thecommunicator.co.cc/2010/04/07/hiding-the-quick-launch-in-sharepoint-2010/

The Code:

<style type> 
body #s4-leftpanel{ 
display:none; 
} 
.s4-ca{
margin-left:0px
} 
</style>

.csharpcode, .csharpcode pre
{
font-size: small;
color: black;
font-family: consolas, “Courier New”, courier, monospace;
background-color: #ffffff;
/*white-space: pre;*/
}
.csharpcode pre { margin: 0em; }
.csharpcode .rem { color: #008000; }
.csharpcode .kwrd { color: #0000ff; }
.csharpcode .str { color: #006080; }
.csharpcode .op { color: #0000c0; }
.csharpcode .preproc { color: #cc6633; }
.csharpcode .asp { background-color: #ffff00; }
.csharpcode .html { color: #800000; }
.csharpcode .attr { color: #ff0000; }
.csharpcode .alt
{
background-color: #f4f4f4;
width: 100%;
margin: 0em;
}
.csharpcode .lnum { color: #606060; }

#s4-leftpanel{
display:none
}
.s4-ca{
margin-left:0px
}

***************************

At its simplest, you’ll do this

The Code to Plug Into the Content Editor Web Part (CEWP)

.ms-navframe{
display:none;
}

Why it is Ideal

1. No need to edit pages with SharePoint Designer, etc.
2. It works better than the ‘Tree View’ option in WSS where you can turn off Quick Launch, as this method will still show the Recycle Bin and View All Site Content as shown below

Figure 1 : Normal Quick Launch

Figure 2 : You could turn it off in WSS by choosing Look and Feel and Tree View

Figure 3 : And then Disable Quick Launch

Figure 4 : But then you still see this

What We are After

Figure 5 : I want this gone and without firing up SPD or modifying page definitions

Here’s how it is Done

How to hide the Quick Launch Bar using a Content Editor Web Part – Video Link:

http://www.screencast.com/users/itgroove/folders/Jing/media/c09bb64f-b117-4bd0-8ffd-99e4dc5434ae

And here’s the Result