zen-codingをターミナルに導入し爆速でhtmlコーディングをする。 #HTML

htmlタグはいちいち終わりタグを書くのもめんどくさいし、同じクラスを持ったliを何度も複製するのもめんどくさい…。そんな中で見つけたのがこのzen-coding。

例えば、

nav#sidebar>ul#menu>li.sub*3

と入力し

[ctrl+y + ,]

を押すと、

<nav id="sidebar">
        <ul id="menu">
                <li class="sub"></li>
                <li class="sub"></li>
                <li class="sub"></li>
        </ul>
</nav>

このように展開してくれる。今回は、このzen-codingをMacのターミナル環境に導入する方法を記録する。

1.zen-codingのプラグインをダウンロード・zip解凍

zen-coding ダウンロード

※この中の emmemt-vim.zip ではなく、zencoding-vim.zip の最新版をダウンロードすることに注意。

2.展開したフォルダの中から必要なフォルダを移動（コピー）

*autoload
*doc
*plugin

この3つのフォルダを、~/.vim/plugin/html/ に移動（コピー）する。ダウンロードフォルダに展開したフォルダがある場合は、

（移動 ver.）$ mv ~/Downloads/zencoding-vim/* ~/.vim/plugin/html/

（コピー ver.）$ cp -r ~/Downloads/zencoding-vim/* ~/.vim/plugin/html/

で必要なフォルダに移動（コピー）出来る。
あとは、ファイル編集時にコマンドを入力していくだけ。htmlファイルに限らず、ファイル編集時にzen-codingは適用されているため、phpファイルでもガンガン使える。

構文等については以下を参照。
zen-coding 構文