Hiding a Menu Item in a SharePoint Context Menu

The goal here was to remove 2 menu items from the context menu on a document library, without affecting the other menu items.  The menu (before changes) is below.

image
Original menu, before any changes

 

The goal was to remove the two menu items “SMS Document Approval” and “Publish a Major Version”.  The first was an old Nintex workflow (great add-on), but when the workflow was deleted, the menu item for some reason didn’t go with it.  The other was being removed to enable us to take finer grained control of the publishing process.

image
Goal: Remove these two menu items

 

Note that I wanted to apply this across the entire site collection, therefore, to accomplish this, I added some CSS code to the site collection’s master page (v4.master).  Right before the end of the <head> section, I added the following block of code:

[css]

li.ms-MenuUIULItem[text~=SMS],
li.ms-MenuUIULItem[text~=Publish]
{
display: none;
}

[/css]

What this is ultimately doing is selecting the menu items (“li’”), and for any menu item whose class is “ms-MenuUIULItem”, where there’s an attribute “text”, whose value begins with the phrase “SMS” or “Publish”, it will hide the entire li, effectively eliminating the menu item.  The HTML code it’s hiding looks a little like this below.

[html]

  • [/html]

    As you can see, in this situation, we were able to take advantage of CSS selectors, and utilize a fairly unused selector, the attribute selector which allows you to match on anything that has an attribute [myattribute], any attribute whose value is exactly equal to somevalue [myattribute=someval] (note, there cannot be spaces in the value), or any attribute whose value is a white space-separated list of words, one of which is exactly “someval” [myattribute~=someval] or [myattribute~=someval otherval] (note: If “val” contains white space, it will never represent anything (since the words are separated by spaces). If “val” is the empty string, it will never represent anything either).

    The final menu ends up looking like the following.

    image
    The final menu, with the two items permanently removed.
  • 4 responses to “Hiding a Menu Item in a SharePoint Context Menu

    1. N1 Colin- let’s also note that since the links are only hidden by CSS but the functionality is still available to savvy end users and could represent a security risk. Admins should well-document this type of visual patching so there’s no surprises down the road.

    2. Keith, yes, you’re absolutely right. Of course the title is “hiding a menu item”, so I wasn’t trying to say it was anything more than that. 🙂 You technically could override any client side methods that are called by these menu items, therefore preventing the functionality from being accessible, but that was overkill for what I needed.

    3. Thank you very much for sharing this tip. I have done some changes in this for SharePoint 2013 and work fine.

      LI.ms-MenuUIULItem[text 1=”Me'” language=”'Alert”][/text] {
      DISPLAY: none
      }

      li.ms-core-menu-item #ID_Checkout, .ms-core-menu-separator hr {
      display:none;
      }

    4. Hi Navaratan,

      Have you included the below code in Core15.css file.

      LI.ms-MenuUIULItem {
      DISPLAY: none
      }

      li.ms-core-menu-item #ID_Checkout, .ms-core-menu-separator hr {
      display:none;
      }

      Please help on this .

      Thanks
      Hari

    Comments are closed.