WebStorm
 
2023.2
Shortcuts: Windows
Get WebStorm
You are viewing the documentation for an earlier version of WebStorm.
  1. Reference
  2. Settings
  3. Appearance & Behavior
  4. Menus and Toolbars

Menus and Toolbars

Last modified: 23 November 2022

File | Settings | Appearance & Behavior | Menus and Toolbars for Windows and Linux

WebStorm | Settings | Appearance & Behavior | Menus and Toolbars for macOS

CtrlAlt0S the Settings icon

Use this page to configure the WebStorm menus and toolbars.

The list shows items in various menus and toolbars, grouped according to the areas of their use.

To configure an item, expand the corresponding node and select the desired item. Use the buttons on the toolbar to edit or remove the selected item, or add a new item under the selected node.

Suppose you want to use a third-party tool from WebStorm. First, you need to configure it as external tool described in External tools, after that it becomes available from Tools | External Tools | <your_tool>.

External tool added to the main menu under Tools | External Tools

You can also run the tool using an icon on the toolbar.

In the Settings dialog (CtrlAlt0S), go to Appearance & Behavior | Menus and Toolbars. In the list of available menus and toolbars, expand the Main Toolbar node, select the item after which you want to add the ImageOptim icon, and click the Add button.

In the dialog that opens, select External Tools | Optimize Image in my app, specify the icon to indicate it in the Icon field, and click Set icon, when ready.

Create external tool: add an icon to the toolbar

The icon appears on the toolbar.

Create external tool: the toll's icons added to the toolbar

Learn more from Customizing menus and toolbars.

Button

Description

the Add button Add Actions…

Add a new item to the list:

  • Add Action…: Open the Choose Actions to Add dialog where you can select an action and assign an icon to it if necessary.

  • Add Separator: Add a line separator to the menu after the selected item.

the Remove button Remove

Delete the selected item from the list.

the Edit Icon button Edit Icon…

Associate an icon with the selected menu item. In the Choose Action Icon dialog, specify the path to the desired image.

tip

The image file should be in PNG or SVG format.

the Move up button Move Up

Move the selected item up.

the Move down button Move Down

Move the selected item one position down.

the Restore icon Restore Actions…

Discard changes and restore default settings, either for the selected item or for all items.