Jan 8 2012

HTML can feel unwieldy and inefficient to edit. There are lots of great tools and alternate syntaxes that make this easier… but who wants to set up a whole framework and all the dependancies that come with that just to be more efficient. With a basic Vim command and the surround plugin you can greatly increase your productivity traversing and manipulating tags.

Say, for instance, you have:

  1. <ul>
  2. <li>something</li>
  3. <li>something else</li>
  4. </ul>

… and you want to make these list items links.

  1. Place your curser inside the list item
  2. Type “vit”. This will visually (v) select the text inside (i) the surrounding tag (t).
  3. Now type ‘s<a href=”#”>’ and the surround plugin wraps the selected text with <a> tags

I find that the surround plugin is an excellent companion to the sparkup plugin.