Welcome Getting started API Reference Samples
Welcome Getting started API Reference Samples

chrome.contextMenus

  • Description

    Use the chrome.contextMenus API to add items to Google Chrome's context menu. You can choose what types of objects your context menu additions apply to, such as images, hyperlinks, and pages.

  • Permissions
    contextMenus

Usage #

Context menu items can appear in any document (or frame within a document), even those with file:// or chrome:// URLs. To control which documents your items can appear in, specify the documentUrlPatterns field when you call the create() or update() method.

You can create as many context menu items as you need, but if more than one from your extension is visible at once, Google Chrome automatically collapses them into a single parent menu.

Manifest #

You must declare the "contextMenus" permission in your extension's manifest to use the API. Also, you should specify a 16x16-pixel icon for display next to your menu item. For example:

{
"name": "My extension",
...
"permissions": [
"contextMenus"
],
"icons": {
"16": "icon-bitty.png",
"48": "icon-small.png",
"128": "icon-large.png"
},
...
}

Examples #

You can find samples of this API on the sample page.

Summary

Types

ContextType

The different contexts a menu can appear in. Specifying 'all' is equivalent to the combination of all other contexts except for 'launcher'. The 'launcher' context is only supported by apps and is used to add menu items to the context menu that appears when clicking the app icon in the launcher/taskbar/dock/etc. Different platforms might put limitations on what is actually supported in a launcher context menu.

Enum

"all", "page", "frame", "selection", "link", "editable", "image", "video", "audio", "launcher", "browser_action", "page_action", or "action"

ItemType

The type of menu item.

Enum

"normal", "checkbox", "radio", or "separator"

Properties

ACTION_MENU_TOP_LEVEL_LIMIT

The maximum number of top level extension items that can be added to an extension action context menu. Any items beyond this limit will be ignored.

Value

number 6

Methods

create

chrome.contextMenus.create(createProperties: object, callback: function): enum

Creates a new context menu item. If an error occurs during creation, it may not be detected until the creation callback fires; details will be in runtime.lastError.

Parameters

  • createProperties
    object
    • checked
      boolean optional

      The initial state of a checkbox or radio button: true for selected, false for unselected. Only one radio button can be selected at a time in a given group.

    • contexts
      ContextType[] optional

      List of contexts this menu item will appear in. Defaults to ['page'].

    • documentUrlPatterns
      string[] optional

      Restricts the item to apply only to documents or frames whose URL matches one of the given patterns. For details on pattern formats, see Match Patterns.

    • enabled
      boolean optional

      Whether this context menu item is enabled or disabled. Defaults to true.

    • id
      string optional

      The unique ID to assign to this item. Mandatory for event pages. Cannot be the same as another ID for this extension.

    • onclick
      function optional

      A function that is called back when the menu item is clicked. Event pages cannot use this; instead, they should register a listener for onClicked.

      The onclick function looks like this:

      onclick(info: object, tab: tabs.Tab) => {...}
      • info
        object

        Information about the item clicked and the context where the click happened.

      • The details of the tab where the click took place. This parameter is not present for platform apps.

    • parentId
      enum optional

      The ID of a parent menu item; this makes the item a child of a previously added item.

    • targetUrlPatterns
      string[] optional

      Similar to documentUrlPatterns, filters based on the src attribute of img, audio, and video tags and the href attribute of a tags.

    • title
      string optional

      The text to display in the item; this is required unless type is separator. When the context is selection, use %s within the string to show the selected text. For example, if this parameter's value is "Translate '%s' to Pig Latin" and the user selects the word "cool", the context menu item for the selection is "Translate 'cool' to Pig Latin".

    • type
      ItemType optional

      The type of menu item. Defaults to normal.

    • visible
      boolean optional

      Whether the item is visible in the menu.

  • callback
    function

    Called when the item has been created in the browser. If an error occurs during creation, details will be available in runtime.lastError.

    The callback parameter should be a function that looks like this:

    () => {...}

Returns

  • returns
    enum

    The ID of the newly created item.

remove

chrome.contextMenus.remove(menuItemId: enum, callback: function)

Removes a context menu item.

Parameters

  • menuItemId
    enum

    The ID of the context menu item to remove.

  • callback
    function

    Called when the context menu has been removed.

    The callback parameter should be a function that looks like this:

    () => {...}

removeAll

chrome.contextMenus.removeAll(callback: function)

Removes all context menu items added by this extension.

Parameters

  • callback
    function

    Called when removal is complete.

    The callback parameter should be a function that looks like this:

    () => {...}

update

chrome.contextMenus.update(id: enum, updateProperties: object, callback: function)

Updates a previously created context menu item.

Parameters

  • id
    enum

    The ID of the item to update.

  • updateProperties
    object

    The properties to update. Accepts the same values as the create function.

    • checked
      boolean optional
    • contexts
      ContextType[] optional
    • documentUrlPatterns
      string[] optional
    • enabled
      boolean optional
    • onclick
      function optional

      The onclick function looks like this:

      onclick(info: object, tab: tabs.Tab) => {...}
      • info
        object
      • The details of the tab where the click took place. This parameter is not present for platform apps.

    • parentId
      enum optional

      The ID of the item to be made this item's parent. Note: You cannot set an item to become a child of its own descendant.

    • targetUrlPatterns
      string[] optional
    • title
      string optional
    • type
      ItemType optional
    • visible
      boolean optional

      Whether the item is visible in the menu.

  • callback
    function

    Called when the context menu has been updated.

    The callback parameter should be a function that looks like this:

    () => {...}

Events

onClicked

chrome.contextMenus.onClicked.addListener(listener: function)

Event

  • listener
    function

    The listener parameter should be a function that looks like this:

    () => {...}
We serve cookies on this site to analyze traffic, remember your preferences, and optimize your experience.