How to hide left navigation links in SharePoint based on user permission in jQuery

This SharePoint customization tutorial explains, how to hide navigation links in SharePoint based on user permission in jQuery. The solution will work in SharePoint 2013/2016 or SharePoint Online.

There are two ways to remove link from Quick Launch in SharePoint 2013.

  1. To customize the navigation, just click EDIT LINKS.
hide left navigation links in SharePoint based on user permission in jQuery

Click EDIT LINKS to customize the top navigation.
Click EDIT LINKS to customize the navigation in the Quick Launch.

NOTE: If you don’t see the option to edit links, you probably don’t have permission to customize the navigation. To customize the navigation, you need to be a site owner or have permission to customize the site.

  1. Click Settings > Site settings. On the Site Settings page, click Navigation and to delete a heading, select the heading you want, and then click Delete.
hide left navigation links in SharePoint 2013 based on user permission in jQuery

Note: These additional navigation settings are available only if the publishing features are enabled for your site collection.

Cause

To get content of a site to be published on the basis of permissions granted, need to make the changes through CSS or JS added to the master page. But in this case, we need to change the master page.

The other way is, do through console application include Custom Actions, global JS files “Script Link” using CSOM code. Without even touching the SharePoint master page and SharePoint designer 2013.

Example:

In a company some of the employees work on a contract basis, they don’t have any employee ID assigned to them and not able to access the whole information available on the portal.

So here, we are going to show the information (e.g. navigation links) on the basis of permission granted to the user.

hide left navigation links in SharePoint online based on user permission in jQuery

Following is the implemented solution:
Cs.Code:

hide left navigation links in SharePoint 2013 based on user permission in jQuery

Uploaded style Library script:

hide left navigation links in SharePoint online based on user permission in jQuery

Final Output:

how to hide left navigation links in SharePoint based on user permission in jQuery

You may like following SharePoint customization tutorials:

Here, we learned how to hide left navigation links in SharePoint 2013/2016 or SharePoint Online based on user permission in jQuery.

Donwload Hub site pdf

Download SharePoint Online Tutorial PDF FREE!

Get update on Webinars, video tutorials, training courses etc.

>