Around here, we love us some Coda. We’ve been using it since at least 2008, so it’s kind of ingrained in the way we work. Pretty early on, we realized we were copying – pasting every other line in the CSS editor, which was time consuming and carpal tunnel syndrome inducing. One of the greatest things about Coda, though, is that you can extend it with plugins – so I set out to write a small plugin that saved us a man-year in highlight-copy-pasting. Now that Coda is debuting it’s second version tomorrow, we’re re-packaging and giving it to the world.
How it works
I write my css like this:
So every time I move to the next element, I have to either copy-paste the line above it, or re-type it. Enter “Tabber”. Now, with Tabber installed and keyboard shortcut set up, I hit my hotkeys when I’m at the end of the last line, and BOOM:
It automagically creates a new line with my previous CSS elements, adds the curly braces, and sticks my cursor where I would fill in my next element.
“ZOMG HOW CAN I OBTAIN THIS SORCERY FOR MY OWN PROFIT AND GAIN?!?” you might be asking yourself. Oh snap – right here.
LIMITATIONS – PLEASE READ
This version above is very fast, but only works with single line CSS. Below is a Coda 2 only version that works with multi-line CSS. It’s a tad slower, as it pulls in your entire document. It also has a weird quirk where after it adds the new line, sometimes it scrolls the document all the way to the bottom of the screen, though the cursor is in the correct position. Hitting any key will snap the screen back to the correct area of the document. This seems to be a bug in Coda, and we have contacted Panic to see if this can be corrected.
How to install and use
Download the plugin and install. To setup the keyboard shortcut, go to Apple -> System Preferences -> Keyboard, Keyboard Shortcuts. Create a new Application Shortcut for Coda, and type Tabber, then just pick your own shortcut! I use Shift+Command+Enter, but feel free to come up with something more clever.
Love it? Hate it? Let us know.