WebStorm 2021.1 Help

Thumbnails tool window

Project tool window | context menu | Show Image Thumbnails

The Thumbnails tool window provides the functions similar to those of an image browser. It shows thumbnails for folders and image files, and lets you perform related navigation and image management tasks.

To open the tool window, use the Show Thumbnails command in the Project tool window. Then, unless you close the tool window, you can show and hide it as described in the section Arrange tool windows.

Title bar context menu

The title bar context menu provides the options for controlling the tool window viewing modes. It also contains the commands for associating the tool window with a different tool window bar, resizing and hiding the tool window.

To access the menu, right-click the window name (Thumbnails).

Note that most of the menu options may alternatively be accessed by means of the title bar icons.

ItemShortcutDescription
Pinned, Docked, Floating, Split ModeThese options let you control general appearance and behavior of the tool window, see Tool window view modes.
Move toTo associate the tool window with a different tool window bar, select this command, and then select the destination tool window bar (Top, Left, Bottom or Right).
ResizeTo resize the tool window by moving one of its borders, select this command, and then select the necessary Stretch to option.

Note that this command is not available in the floating mode.

HideShift+EscapeUse this command to hide the tool window.

Title bar icons

ItemShortcutDescription
Icons general gear plainUse this icon to open the menu for changing the tool window viewing modes.
Hide tool windowShift+Escape

Hide the tool window Shift+Escape.

To hide all the tool windows, press Ctrl+Shift+F12.

Toolbar icons

The toolbar icons provide access to the most frequently used functions available in the tool window. The same and other functions are available as context menu commands in the content pane.

ItemShortcutDescription
Level upBackspace

Use this icon or shortcut to move one level up in the folder hierarchy.

The path to the current folder is shown on the title bar to the right of the tool window name.

Flatten PackagesCtrl+Alt+NumPad +Use this icon or shortcut to turn the Recursive option on or off.

If this option is off, subfolders of the current folder and image files located in the root of the current folder are shown.

If this option is on, the subfolders are not shown; the image files located in the current folder and all its subfolders are shown.

The following picture shows the contents of the same folder with the Recursive off and on.

Recursive on and off
the Hide/Show Chessboard button

Use this icon to show or hide a "chessboard".

The "chessboard" (a checkered area) is shown underneath the images so that you can see transparent image areas for .gif and .png files.

The following picture shows the same thumbnail with the "chessboard" shown and hidden.

Chessboard Shown/Hidden
CloseCtrl+F4Use this icon to close the tool window.

Content pane: context menu commands

When you right-click an item in the content pane, the context menu for this item is shown.

The following table lists and briefly explains the main context menu commands for thumbnails. Other commands, functionally, are similar to those in the Context menu commands for the content pane items.

ItemShortcutDescription
BrowseEnter

For a folder: use this command to view the folder contents (subfolders and images).

The same command may alternatively be accessed by double-clicking a folder.

Jump to SourceF4 or Enter

For an image file: use this command to view the selected file in the editor.

The same command may alternatively be accessed by double-clicking an image thumbnail.

Level upBackspaceUse this command to move one level up in the folder hierarchy.
RecursiveCtrl+Alt+NumPad +Use this command to turn the Recursive option on or off.
Show or Hide ChessboardUse this command to show or hide the chessboard.
Close thumbnailsCtrl+F4Use this command to close the tool window.
Jump to External EditorCtrl+Alt+F4For an image file: use this command to open the image in an external editor.
Last modified: 26 April 2021