Sharepoint 2013 - Hide left Navigation, but not in People and Groups

3
votes

I tried to hide the left Navigation bar and it works without problems. The only problem now is that when I go under: Site settings > User Permissions > People and Groups

It hides me my Groups I created there on the left side. Is there any possibility of hiding the left navigation bar in all sites and leaving "People and Groups" alone?

I made my own css file and used this to hide the Navigation bar:

MyOwnCss.css:

#sideNavBox { DISPLAY: none }
#contentBox { margin-left: 0px }

Best regards

Andrew

2
csssharepointsharepoint-designersharepoint-2013

2 Answers

6
votes

Solution:

Try below css (instead of yours):

.ms-core-sideNavBox-removeLeftMargin { display: none } /* hide only quick links */
#contentBox { margin-left: 0px } /* make content take full page width */

Explaination:

Div with id sideNavBox is the main container of left navigation box. But it is not the actual container that holds the quick links.

SP2013 Left Navigation Element Hierarchy

Actually quick links is contained by another div with class ms-core-sideNavBox-removeLeftMargin which is a child div of div with id sideNavBox.

Now people and groups left panel items are not contained in this div with class ms-core-sideNavBox-removeLeftMargin but is instead contained in div above it with class ms-ql-additionaltopsection (as shown in above image).

So our solution above hides this actual quicklinks containing child div:

.ms-core-sideNavBox-removeLeftMargin { display: none } /* hide only quick links */

instead of parent container

#sideNavBox { display: none } /* hide left navigation box */

You can find my detailed blog on this matter here.

0
votes

If you wish to remove the sidenavbox only in special cases then you should do the following:
1. Edit the Relevant master page in SharePoint designer (in my example below I edited the System Master Page.
Below example checks for form pages and removes the sidenavbox only there.
2. Add the following script (jQuery):
Code:

   <script>
      $(document).ready(function () {

        if(window.location.href.indexOf("newifs.aspx") > -1) {
             $('#sideNavBox').css('display', 'none');
             $('#contentBox').css('margin-right', '0px');
           }

        if(window.location.href.indexOf("editifs.aspx") > -1) {
           $('#sideNavBox').css('display', 'none');
           $('#contentBox').css('margin-right', '0px');
         }

       if(window.location.href.indexOf("displayifs.aspx") > -1) {
          $('#sideNavBox').css('display', 'none');
          $('#contentBox').css('margin-right', '0px');
      }

  })
</script>


3. Save and check-in the Master Page.
Now, you will not need to edit every page containing a form to add content webparts and such. This will work on all pages specified in the script.