WebStorm 2016.3 Help

Navigating with Breadcrumbs

On this page:

Overview

In the HTML and XML context, you can navigate through the source code using breadcrumbs that are displayed above the main editor window. The breadcrumbs show the elements of a XML or HTML file opened in the active editor tab:

/help/img/idea/2016.3/breadcrumbs.png
/help/img/idea/2016.3/breadcrumbs_xml.png

To have breadcrumbs shown, you have to enable them.

Enabling breadcrumbs

To have breadcrumbs displayed

  1. Open the WebStorm Settings/Preferences dialog.
  2. Under the Editor node, click General | Appearance.
  3. In the Appearance page, select the Show breadcrumbs check box.

Navigating between a breadcrumb and the source code

To navigate with breadcrumbs

  • Click the breadcrumb with the relevant tag. The cursor jumps to the corresponding element in the source code.

See Also

Last modified: 22 March 2017