Emacs zencoding-modeにHTML5タグを追加する設定

Emacs zencoding-modeにHTML5タグを追加する設定

zencoding-modeにHTML5要素を追加してみました。

さまざまなエディタでHTMLやCSSを簡単に記述できるzencodingという記法があります。Emacsにもありますが、HTML5のタグには対応していないので設定で追加しておきました。yasnippetがあればさらに便利になります。

zencoding-modeバージョンは0.5.1です。

github - rooney / zencoding

設定


;; zencoding-mode
(when (require 'zencoding-mode nil t)
  (setq zencoding-block-tags
        (append (list
                 "article"
                 "section"
                 "aside"
                 "nav"
                 "figure"
                 "address"
                 "header"
                 "footer")
                zencoding-block-tags))
  (setq zencoding-inline-tags
        (append (list
                 "textarea"
                 "small"
                 "time" "del" "ins"
                 "sub"
                 "sup"
                 "i" "s" "b"
                 "ruby" "rt" "rp"
                 "bdo"
                 "iframe" "canvas"
                 "audio" "video"
                 "ovject" "embed"
                 "map"
                 )
                zencoding-inline-tags))
  (setq zencoding-self-closing-tags
        (append (list
                 "wbr"
                 "object"
                 "source"
                 "area"
                 "param"
                 "option"
                 )
                zencoding-self-closing-tags))
  (add-hook 'html-mode-hook 'zencoding-mode)
  (add-hook 'php-mode-hook 'zencoding-mode)
  ;; yasnippetを使わない場合
  ;; (define-key zencoding-mode-keymap (kbd "C-,") 'zencoding-expand-line)
  ;; yasnippetと連携する場合 (キーバインドは自由に)
  (define-key zencoding-mode-keymap (kbd "C-,") 'zencoding-expand-yas))

yasnippetと連携すれば、例えば [ol>li*3>a href="#"] を展開した場合、TABでぴょんぴょん移動できるようになります。

セルフ閉じタグ設定

brを展開すると<br/>となってしまいます。HTML5ではスラッシュが不要なので消しておきます。気にならない人はそのままで。

zencoding-mode.elの449行目"/>"となっている部分を">"に書き換えます。"zencoding-make-html-tag"という関数の中身です。

これでbrやimgの閉じにスラッシュが付かなくなります。

参考

HTML5 クイックリファレンス