Menu customization

From MozillaZine Knowledge Base
Jump to navigationJump to search

There are several ways to tweak menus of your XUL-based application, like Mozilla Suite, Thunderbird or Firefox.

Menu Editor and Menu Wizard extension

The Menu Editor extension allows you hide the menu items as well as reorder them. However, it doesn't seem to be actively maintained anymore. The Menu Wizard (Firefox) and Menu Wizard (Thunderbird) add-ons are better choices.

Menu Editor 1.2 discussion thread on MozillaZine forums.

ContextMenu Extensions extension

This extension allows context menu items to be added according to user-defined scripts, offering the possibility for the user to add, for example, a context menu item which appends text to the beginning, middle, or end of a right-clicked URL to allow the predictably modified URL to appear in a new window.

Various Other Extensions

Assorted extensions may add context menus (or general menu items) depending on the extension.

Context menu extensions which allow customization of the context menu include:

  • Context Search - Adds search plugins (which are customizable) to the context menu (searches highlighted text).
  • Dictionary Search - Allows searching of user-defined websites (not only dictionaries) through wildcard (works on selected text, not a selected link)
  • Ook - Allows bookmarks (which are of course customizable by the user) to be added to the context menu

Wiki/Forum-relevant extensions

The Wikipedia Context Menu Search extension lets you search for highlighted text on Wikipedia via the context menu. Another useful extension for wiki editing is the "Save Text Area" extension which allows saving text from and loading text into textboxes.

Tweaking userChrome.css

If you don't want to install the Menu Wizard extension you can tweak your menus using userChrome.css. First locate your profile folder. There's a subfolder called "chrome". What you need to do is edit the "userChrome.css" file (create it if it does not exists).

Using ID selectors

Add a line like this to hide any menu item:

#id1, #id2 { display:none !important; }

replacing each of the identifiers #id1, #id2, ... with one of the selectors from UserChrome.css Element Names/IDs#Firefox menus.

Example (hides the "View Background" menu item and the horizontal line after it):

#context-viewbgimage,
#context-sep-viewbgimage {
  display: none !important;
}

Using attribute selectors

Another way to change the style of a menu item is to use the label attribute selector.

For example, if you want to hide the "Close Tab" menu item on the tab bar context menu:

menuitem[label="Close Tab"] {
    display: none !important;
}

or if you want to change the "For Internet Explorer Users" appearance on the "Help" menu:

menuitem[label="For Internet Explorer Users"] {
    text-decoration: line-through !important;
}