How to show/hide ribbon and quick launch in sharepoint 2010?

18,539

Solution 1

Note - you should use scripts to do this - that way you can add a web part to execute the proper CSS when you need it.

The VERY best way to do this is to use a text file to store the CSS (or script). Add to a document library then use a content editor web part to execute it.

For example, to hide the left navigation (all sites):

<style type="text/css">
#s4-leftpanel { display:none !important; }
.s4-ca { margin-left:0px !important; }
</style>

To show the left navigation in a publishing site:

<style type="text/css">
#s4-leftpanel{
width:155px;
float:left;
display:inline !important;
}
.s4-ca{
/* [ReplaceColor(themeColor:"Light1")] */ background:#fff;
margin-left:155px !important;
margin-right:0px;
min-height:324px;
}
</style>

Using this method you don't have to embed things - and you can add the web parts to a page layout automatically.

David Sterling davidmsterling.blogspot.com www.sterling-consulting.com

Solution 2

Never mind , got it. you can just edit the page using the sharepoint designer- there you can see the hidden web part with the CSS code and edit it.

Share:
18,539
Ned
Author by

Ned

Updated on June 14, 2022

Comments

  • Ned
    Ned almost 2 years

    I'm building a site using Sharepoint 2010 but unfortunately i have very limited options as far as server side editing (my workplace deleted a few features from the sharepoint server).

    Right now i'm displaying different Lists in tabs (using EasyTabs 5.0 script) and for this i need to show the lists without any UI - no ribbon and no quick launch. I found a way to get rid of both but now i find myself in a new predicament - i can't edit the list using the ribbon because i don't know how to bring it back!

    to hide the ribbon and/or i used content editor parts with the following code:

    <style type="text/css"> 
    
    #s4-ribbonrow, .ms-cui-topBar2, .s4-notdlg, .s4-pr s4-ribbonrowhidetitle, .s4-notdlg noindex, #ms-cui-ribbonTopBars, #s4-titlerow, #s4-pr s4-notdlg s4-titlerowhidetitle, #s4-leftpanel-content {display:none !important;}
        .s4-ca{margin-left:0px !important; margin-right:0px !important;}
    
    
    </style>
    

    Any ideas on how to edit my list now or maybe how to get the ribbon back?

    Thank you very much.