Menus and Toolbars

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 as described in Choose Actions to Add dialog.

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/Preferences dialog (Ctrl+Alt+S), 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 .

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.

The icon appears on the toolbar.

Learn more from Customizing menus and toolbars.

Button	Description
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.
Remove	Delete the selected item from the list.
Edit Icon…	Associate an icon with the selected menu item. In the Choose Action Icon dialog, specify the path to the desired image. The image file should be in PNG or SVG format.
Move Up	Move the selected item up.
Move Down	Move the selected item one position down.
Restore Actions…	Discard changes and restore default settings, either for the selected item or for all items.

Last modified: 17 March 2022