How to display custom context menu in SharePoint list or Document library?

Standard  context menu is the drop down menu displayed when a document library item or a list item is selected.

Whevever this menu is executes, it used JavaScript file which located in “C:\Program Files\Common Files\Microsoft Shared\web server extensions\12\TEMPLATE\LAYOUTS\1033\OWS.js.

OWS.js also allows users to implement custom menu options that can be used to create a custom menu in the context menu.

Or you can use a content editor web part can be used to implement the same if the context menu is required only in a particular site collection.

Add a content editor web part for the library or the list for which the context menu needs to be implement. Then click on the link that says open the tool and pane which opens up the tool pane. In the Source Editor Web part add the following JavaScript code to add following custom menu for a Document Library

<script language="javascript">
function Custom_AddDocLibMenuItems(m, ctx)
{
var strDisplayText = "Navigate to Yahoo";
var strAction = "STSNavigate('http://www.Yahoo.com’)";
var strImagePath = "";
// Add our new menu item
CAMOpt(m, strDisplayText, strAction, strImagePath);

// add a separator to the menu
CAMSep(m);

// false means that the standard menu items should also be rendered
return false;
}
</script>

Save the script and check the Hidden option in the Layout section of the tool pane, now see te context menu

We have seen that how we can add custom context menu for a Document Library, with Custom_AddDocLibMenuItems function, if you want to add custom context menu for a list then use Custom_AddListMenuItems function in place of Custom_AddDocLibMenuItems function.