いつもはAddQuicktagを使って書いていたのですが、先日、Emmetが使えるプラグインあることを知り、使ってみたらすごく便利だったのでご紹介です。

Emmetが使えるようになるプラグイン『WP Emmet』

『WP Emmet』の導入

プラグインの新規追加で『WP Emmet』を検索してインストールして有効化する。

『WP Emmet』の設定

すると、管理画面メニューの設定にWP Emmetが表示されますので、そこから設定をします。

設定画面のエディタのところの初期値です。ここのコードカラーリングにチェックを入れると

• テーマ
• タブとインデント
• 外観
• エディタースタイル

の設定ができます。

テーマをmonokaiにして保存。投稿画面を見ると

こんな感じでいつもの投稿部分の下のほうにエディタが表示されます。

実際に使うときには、ここにどんどん記載していくかたちになります。
下書き保存をすると投稿（図でいうと上の白いところ）に反映されます。

テーマを設定しない場合は、いつもの通り（通常画面）に記載する感じです。

『WP Emmet』のキーバインド設定

初期値はTabキーで展開ですが、いつも使い慣れているキーにしたい場合は、設定にある「ショートカット」にチェックを入れると設定できるようになります。

『WP Emmet』の設定画面の1番下にプレビューがあるので、そこでも設定状況を確認することが出来ます。

Crayon Syntax Highlighterのコード入力

このブログでは、コードを表示に、Crayon Syntax Highlighterを使用していますが、ここでもEmmetを使用することが出来ます。

ただ、テーマを設定するとわたしの環境では展開することが出来ませんでした。
深く追求していないので原因はちょっとわからないのですが、デフォルトの状態だと展開出来たので現在は、この状態で使っています。

Emmet使いにオススメです