Can Vim highlight matching HTML tags like Notepad++?

Vim has support for matching pairs of curly brackets, parentheses, and square brackets. This is great for editing C-style languages like PHP and JavaScript. But what about matching HTML tags?

Notepad++ has had this feature for as long as I’ve been using it. Being able to spot where blocks of HTML begin and end is very useful. What I’m looking for is something like this for Vim (see the green div tags):

A bonus feature: highlighting unclosed HTML tags, like the red tag in the above screenshot.

matchit has been proposed as the next-best-thing, but it requires an extra keystroke to use its functionality. I’d like be able to see where the blocks of HTML begin and end without an extra keypress.

I’ve trawled the internet to find something like this for Vim. Apparently, I’m not the only one, according to two other StackOverflow questions and a Nabble thread.

I’ve almost resigned myself to Vim not being able to visually match HTML tags. Is it possible for Vim to do this?

Addendum: If it is not currently possible to do this with any existing plugins, does any Vimscript wizard out there have any pointers on how to approach writing a suitable plugin?

Solution 1:

I had to work with some HTML today so thought I would tackle this. Added a ftplugin to vim.org that should solve your problem.

You can get it here on vim.org.

You can get it here on github.

Hope it works for you. Let me know if you have any problems.

Solution 2:

Greg's MatchTag.vim plugin is awesome, but I wanted something more. I wanted the enclosing tags to always be highlighted, not just when the cursor is on one of the tags.

So I wrote MatchTagAlways which does everything that Greg's MatchTag does and also always highlights the enclosing tag, no matter where the cursor is in the code. It also works with unclosed tags and HTML templating languages like Jinja or Handlebars.

Here's a GIF showing it in action: