Over a million developers have joined DZone.

Vim and HTML Tags with the Surround Plugin

DZone's Guide to

Vim and HTML Tags with the Surround Plugin

· Java Zone
Free Resource

Download Microservices for Java Developers: A hands-on introduction to frameworks and containers. Brought to you in partnership with Red Hat.

Marking up documents is always tedious, and usually there are shortcuts available. My favourite document format tool is Pandoc, literally a box of document-conversion tricks! Today though I was not so lucky, so I marked up a plain text file as HTML by hand ... or rather, using my favourite vim tricks so I thought I'd share them.

Vim Plugins

Two plugins in particular helped me today:

  • surround.vim which works very nicely with quotes and brackets as well as tags
  • repeat.vim allows you to repeat complex actions rather than just the last keystroke combination

I use pathogen and git submodules to manage my plugins so I installed them in my .vim/ directory with:

git submodule add git submodule add git://github.com/tpope/vim-surround.git bundle/surround
git submodule add git submodule add git://github.com/tpope/vim-repeat.git bundle/repeat

With both of these in place, I can quickly mark up my plain text document with HTML tags. I was wrapping whole lines in tags, so I used commands like this:

  • To add a

    around this line: yss<h1>

  • To add a

    around this line: yss<li>

  • To add a

    around a bunch of lines, highlight them with Shift+V and moving, then do: S

The plugin understands tags and so will close your HTML (or XML) tag for you at the end of the line or selection - very neat!

With these and the ability to press dot to repeat what I just did but on another line, it was quicker to mark up my document than I expected. Since I'll be doing more HTML in future than I have until this point, I thought I'd write down some hints here so I can refer back to them.

I also found this article very helpful: http://www.catonmat.net/blog/vim-plugins-surround-vim/, and it's the first in a whole series about handy vim plugins.

Download Building Reactive Microservices in Java: Asynchronous and Event-Based Application Design. Brought to you in partnership with Red Hat


Published at DZone with permission of Lorna Mitchell, DZone MVB. See the original article here.

Opinions expressed by DZone contributors are their own.

{{ parent.title || parent.header.title}}

{{ parent.tldr }}

{{ parent.urlSource.name }}