How To Remove Left Menu Navigation From A SharePoint 2013/2016 Site Page

When we design SharePoint pages, sometimes we need some extra space to design or want to hide left navigation menu to avoid the end user activity. The steps are given below, which will help to achieve this very easily and quickly.

  1. Open your page in Edit mode by clicking on EDIT option (top right of your site)
  2. Click anywhere inside the body of your site page and click INSERT (top menu), followed by clicking Webpart. Under categories, select Media and Content, followed by Content Editor.
  3. Click Add button (bottom right) on the ribbon.
  4. Click the Content Editor box that just appeared. Select the dropdown in the top right of that box and select Edit Web Part.
  5. Now, you see Text "Click here to add new content" on Content Editor WebPart. Click on this link.
  6. Click the Edit Source under Insert Menu ribbon.
  7. Copy the code (which is provided in the end of this article) in popup Window, click OK.
  8. Now, you have left navigation, which is hidden. Please make sure you save the changes and check-In the page.

Code

<style unselectable=”on”>  
    /* On site page hide left navigation menu */  
     
    #sideNavBox {  
        display: none;  
    }  
    /* adjust position of content on site page */  
     
    #contentBox {  
        margin-left: 20px!important;  
    }  
</style>