Hiding Left Navigation Frame and Quick Launch Bar – MOSS

Hi,

I just wanted to give a quick tip on how to

• hide left navigation frame
• hide quick launch bar
• hide recycle bin

in MOSS pages.

There are a lot of solutions out there to above stated desired look & feel. They have all their pros and cons, of course. However, I won’t discuss any of those. I just want to share my approach. Hopefully the easiest one

Step-1: Create Alternate CSS file:

For this part, all you need to do is copy the following lines to an empty txt file and rename it to myAlternateCSS.css. First one hides Recycle Bin, second hides View All Site Content link, and third one hides the whole Left Navigation Frame. You can include/exclude any of those according to your needs. 

div.ms-quicklaunch table.ms-recyclebin {
display: none;
}

#ctl00_PlaceHolderLeftNavBar_idNavLinkViewAll {
       Visibility:hidden;
}

.ms-navframe {
 display:none;
}

 

Step-2: Upload CSS file to any document library:

After creating necessary css file, we need to upload it to any document library so that we can provide its URL to AlternateCssUrl property of the website.

 

Step-3: Change AlternateCssUrl of the site:

Although you can do this programmatically, alternatively I want to show how we can make use of SharePoint Branding Tool. This tool is so easy to use and gives you a lot of flexibilty while,

* modifying Themes,
* modifying MasterUrl (Master Page),
* modifying CustomMasterUrl (System Master Page),
* modifying SiteLogoUrl (Site Logo),
* modifying SiteLogoDescription (Site Logo Alternative Text),
* modifying AlternateCssUrl (Custom CSS Style Sheet).

You can got it from its CodePlex site:

http://www.codeplex.com/BrandingTool

http://www.codeplex.com/BrandingTool/Release/ProjectReleases.aspx?ReleaseId=14392

After running this tool, all you need to do is to open your MOSS site, select the site you want to edit and enter the URL to css file created and uploaded above.

SharePoint Branding Tool

In the above screenshot,

Moss Server Name: Server

Document Library Name (for uploading our alternate CSS file): Styles

Alternate CSS File Name: myAlternateCSS.css

After entering Alternate CSS Url and selecting the site you want to apply the sytlesheet, simply click “Apply to Selected Sites” button, and then go to your site home page.. That’s it..

Hope it works for you

Please let me know if you have troubles applying this approach.

zieglers