AtomやSublimeTextにWebコーダーが登録しておくとちょっと便利なスニペット

AtomやSublimeTextに登録しておいたら意外に便利ではかどったスニペットをご紹介します。

divとclassと閉じコメント

divとclassと閉じコメントです！あまりにもベーシックすぎて登録してなかったんですけど、登録してからマークアップがはかどるし、どこの閉じタグやったっけ？ってソースを見直すことも激減！地味だけど便利！

<div class="最初のフォーカス">
次のフォーカス
<!-- /最初のフォーカス --></div>

このスニペットの便利なところは最初のフォーカスで閉じコメントとClassを同時に記述することができることです。

Atomの場合

'.text.html.php,.text.html.basic':
  'divclass':
      'prefix': 'divc'
      'body':"""
      <div class="$1">
        $2
      <!-- /$1 --></div>
      """

Atomのスニペット登録方法

SublimeTextの場合

<snippet>
	<content><![CDATA[
<div class="${1}">
	${2}
<!-- /${1} --></div>
]]></content>
	<tabTrigger>divc</tabTrigger>
</snippet>

SublimeTextのスニペット登録方法

コメントの位置はレギュレーションで変更していただければと思います。