Vim Essential Plugin: SnipMate


The SnipMate plugin aims to mimic the popular snippets feature in TextMate, which allows you to type a sequence of characters, and then automatically expand to a full block of code or html by pressing Tab. It's incredibly helpful.


Once installed, you only need to type the desired snippet trigger, and then press Tab. Keep in mind, though, that the available snippets are limited to the extension of the file you're working on. For example, JavaScript snippets will not work within an HTML file, and vice versa.

Try visiting your ~.vim/snippets directory for an overview of all the available shortcut keys. You can even create your own!

snippet mysnippet

If the above snippet is placed within the HTML.snippets file, you'll then be able to create a bla element by typing the shortcut, mysnippet.

Note: When creating new snippets, you'll need to either restart Vim, or open a new window before testing.

Related Posts
  • Computer Skills
    Make Wunderlist Into the Ultimate To-do ListWunderlist logo
    The original simple to-do list app is actually far more powerful than it appears at first. Here's the tips and tricks you need to turn it into a productivity powerhouse that'll help you keep track of everything you need to do on any of your devices.Read More…
  • Web Design
    Taking Shopify Theme Development FurtherShopify thumb
    In this final part of our Shopify series we will look at how a deeper knowledge of Liquid will enable you to make your themes even more flexible. This will help you deliver richer and more imaginative store designs.Read More…
  • Computer Skills
    App Training
    PowerPoint 101: Everything You Need to Make a Basic PresentationPreview powerpoint fundamentals
    PowerPoint's the original presentations app for the Mac and PC, but it's a complex app. It's got so many features, it's tough to just make a simple presentation. If you've never made a PowerPoint presentation before, or have always found it more confusing than it should be, here's the step-by-step tips you need to make a perfect PowerPoint presentation.Read More…
  • Web Design
    Applications and Tools
    9 Sketch Features You Should be UsingSketch retina new
    Sketch is a graphics application for designers, lending itself very nicely to the world of web design. If you're new to it, you may not be aware of some of the tricks Sketch has, hidden under the surface. Today I'd like to run through some top tips to speed up your design workflow.Read More…
  • Code
    Creative Coding
    Creating a TextMate Bundle to Easily Package Your WordPress ProjectTextmate bundle 400
    If you've developed a WordPress theme or plugin, then you know how fast your codebase can grow in just a short amount of time. You start off with just a few PHP, JavaScript and CSS files. Then you find yourself creating image assets and adding them to your codebase together with their Photoshop file counterparts. After a while you'll be including other third-party PHP libraries as well. Then when you're finally ready to ship your WordPress project, you'll end up having a web of multiple file types like *.php, *.css, *.scss, *.js, *.min.js, *.png and *.psd, maybe you'll have some hidden files like .DS_Store. You would eventually need to clean your codebase up before zipping them all up for your users. Normally, this just means that you duplicate your files, then scan each and every directory deleting all the unwanted files. You'd then archive your project then perhaps use a third party app to remove the hidden files. This article will teach you on how to automate this packaging process by building a TextMate Bundle that would do everything for us with a single shortcut key. [tip]This article teaches about some tips regarding TextMate, an awesome code editor for Macs. You can find more information on TextMate from MacroMate's website[/tip]Read More…
  • Code
    Tools & Tips
    Coding in the CloudCoding in cloud retina preview
    The Internet has allowed us to work anywhere we want, giving us tremendous flexibility in choosing where we'd like to plant ourselves to build the next great app. Not being tied to an office desk has been a blessing to many who cherish the ability to work in varying environments and draw inspiration from their surroundings. But for the most part, we've needed to have a full-blown development machine to make this happen. What if we could leverage the cloud as a development environment itself, freeing us up to choose from a variety of devices to accomplish the same thing. That's what we'll explore in this article.Read More…