Highlighting of HTML tag tree

Since version 2.1, WebStorm & PhpStorm both come with a new code highlighting feature. It makes it easier to work with big and complex HTML files, with deep nested tags structure:

Please note that highlighting is only activated when there is more than one tag with the same name in the hierarchy.

By default, only 6 parent tags are highlighted with 6 different colors. You can change the depth to highlight or completely disable the feature in Settings | Editor | Appearance | Enable HTML tag tree highlighting.

Also you can tweak the colors in Settings | Editor | Colors & Fonts | HTML.

Download WebStorm (or PhpStorm, if you use PHP) and try!

This entry was posted in Cool Feature and tagged , , . Bookmark the permalink.

6 Responses to Highlighting of HTML tag tree

  1. René says:

    i really like this Feature

  2. Eduard says:

    The Settings are also present in PyCharm, but the highlights are missing both in the preview and in the editor. Any plans to fully support it in PyCharm?

  3. Eduard says:

    Sorry, it works ok in PyCharm, I skipped the part with “highlighting is only activated when there is more than one tag with the same name in the hierarchy.”

  4. Eugene Toporov says:

    @Eduard: the feature does not yet fully work for Django templates and all html files are treated as such in a Django project by PyCharm. We plan to have this feature supported in one of next PyCharm versions.

  5. Gregorio Ramirez says:

    What’s with the absence of eaps?

  6. @Gregorio: Summer :) Developers also need to have vacation :)

Leave a Reply

Your email address will not be published. Required fields are marked *