Steps to hide admin menu items in nopCommerce 3.2 based on roles

Many times, I have seen users asking same question in regard to nopCommerce "How to hide menu item based on roles". Since nopCommerce offers a great feature called "Access control list", it does makes sense that an administrator of any website would like to show or hide some pages or menu item to give limit access to other users who are maintaining the site or have access to the admin section.

Having an option to hide menu items based on roles is a very useful feature and it can be used in many different scenarios / situations where administrator gives access to other users to maintain the site or to add data/content but do not want those users to see private pages. This feature it is NOT available in nopCommerce by default as it is a custom feature that can vary for each website administrator.

Today, I am going to show how to accomplish this and I hope it helps nopCommerce users who are looking for a solution to this problem / question.

Let us take an example of an existing menu item "Help" in the administration section. Let us say, admin would like to hide "Help" menu or its sub-menu items hidden based on roles.

The best way (or cleanest way) to accomplish this is by adding "Permission name" so that you can manage this feature in your admin side also and you don't have to rely on changing code every now and then.

Right now it is visible to everyone like this:



Step 1)
If we look into the code in this location: Nop.Admin > sitemap.xml (Open this sitemap file)

Many users might thing that they can simple remove the menu item from the sitemap but the only problem of this approach is that, it will remove  the menu item for all roles (including Administrator).

In your sitemap, if you observe other menus, you will see a property "Permission Name" and if you compare other menus with Help menu, you will not see that property. Add this property in your help menu like this:

<siteMapNode title="Help" PermissionNames="ManageHelpMainMenu" nopResource="Admin.Help" ImageUrl="~/Administration/Content/images/ico-help.png">

  

 <siteMapNode title="Help topics" PermissionNames="ManageHelpSubMenu1" nopResource="Admin.Help.Topics" url="http://www.nopcommerce.com/documentation.aspx" />

  

 <siteMapNode title="Community forums" PermissionNames="ManageHelpSubMenu2" nopResource="Admin.Help.Forums" url="http://www.nopcommerce.com/boards/" />

  

 <siteMapNode title="Premium support services" PermissionNames="ManageHelpSubMenu3" nopResource="Admin.Help.SupportServices" url="http://www.nopcommerce.com/supportservices.aspx" />

  

 </siteMapNode>

P.S. If you notice, I have named "PermissionNames" property different for each menu item in "Help" menu. The only reason is to show you how it can work for complete menu item or its sub-menu items in case you would like to hide only the sub-menu items for any user based on his/her role.



Step 2)
Now go to  your Now to your nopCommerce database table and look for the table "PermissionRecord"

Add this as a new line / record (for Main menu "Help"):
Name: Admin area. Manage Help Main Menu
SystemName: ManageHelpMainMenu
Category: Configuration

In the same manner, I am adding new line / record for each sub menu like this:






Step 3)
Now restart your complete project again and login as admin. You will notice that you will not see "Help" menu. The reason is because you have added a new property and by default you are not allowed to see it. Go to Access Control List and you should see a new properties that you just added like this:






Step 4)
Check these properties for your role "Administrator" and once you save it you will see the Help menu





That's all !!!

Same way you can give control / hide menus for other users based on roles from the access control list.








Hope it helps...