- 2010年7月16日 12:00 AM
Zen Codingをサクラエディタで行えるように一部の機能だけですが移植しましたので公開します。
- 設定方法
- ZenCodingForSakuraEditor.zipをダウンロードし、解凍します。

- ZenCoding.jsをサクラエディタのマクロフォルダに設置します。
(例ではサクラエディタのインストールフォルダ内に”macro”というフォルダを作り、そこへコピーしています。)

- [設定(O)]->[共通設定(C)...]->タブ[マクロ]を開きます。(Ctrl+6 でも開けます。)

- [参照]を押下し、マクロフォルダの設定します。
[File]のドロップダウンリストからマクロファイル「ZenCodeing.js」の読み込みます。
[名前]にマクロ名「ZenCoding」を入力し、[設定]を押下します。

- 設定が反映されると、マクロ一覧に設定したマクロ「ZenCoding」が表示されます。

- タブ[キー割り当て]を開き、[種別(K)]で「外部マクロ」を選択します。
[機能(F)]に「ZenCoding」が表示されますので選択します。
他のソフトウェアでは[Ctrl]+[E]が実行キーなのですが、サクラエディタではすでに他の機能が割り当てられていますので[Alt]+[Z]を割り当てます。
[Alt]のチェックボックスにチェックを入れ、[キー(Y)]から「Alt+Z」を選択し、[割付(B)]を押下します。

- 設定が反映されると、[機能が割り当てられているキー(G)]に設定したショートカットキー「Alt+Z」が表示されます。
[OK]を押下して、設定を完了します。

- ZenCodingForSakuraEditor.zipをダウンロードし、解凍します。
- 使い方
- これで使う準備ができましたので、早速動作確認をしてみましょう。
エディタに”html:4s>div>ul>li*3>a”と入力してみましょう。
- 入力が完了したら、先ほど設定した[Alt]+[Z]キーを押下してみてください。
HTML文が展開されれば成功です。

- これで使う準備ができましたので、早速動作確認をしてみましょう。
- 関連
コメント:10
- まさ 2011年2月28日
便利なマクロを公開していただきありがとうございます!
質問ですが、CSSでのZenCodingの仕方が分かりません。
「@i」としてから実行しても、「<@i></@i>」のようにHTMLとして実行されます。CSSのZenCodingを行うにはどこか設定しないといけないのでしょうか?
- yobane 2011年3月10日
ご利用いただきありがとうございます。
まず、ZenCodingの仕様して解析はHTMLとCSSに別れており、モードを切り替えればCSSが展開されHTMLは展開されないという動作になっているようです。
このモード切替は基本的にはファイルの拡張子やStyleタグで判断するようですが、現在提供しているサクラエディタのマクロにはサクラエディタがHTMLモードかCSSモードか判断する処理を持っていないためデフォルトとしてHTML解析モードで動作しています。
なので、下記のように1行で記述した場合はモードを動的に切り替えているため、うまく展開されると思うのですが、これもうまくいきませんか?<style type="text/css">@i</style>また、上記のとおりHTMLモードで動作してるため、ファイルの拡張子を.cssにしたり、サクラエディタのモードをCSSにしてもご指摘いただいたようにCSSは展開されません。
CSSでの展開を行いたいのであれば、モード切替部分をマクロの修正など何らかの手段で実現すれば可能と思われます。
(つまり、この部分は現バージョンでは未対応です。時間が取れ次第、調べてみます。)
なお、手直しをされて対応された場合、修正を取り込みたいと思いますのでご連絡いただければと思います。- maruta 2011年6月3日
JS単体で実行すると、エラーが出てしまい、
sakuraでマクロ実行しても何も反応しません。。解決頂くことは可能でしょうか。
他に必要な情報があればご連絡いただけますでしょうか。
sakura愛用しているので、ぜひともこちらのマクロを使いたいです!!
- yobane 2011年6月10日
自分の開発環境及びネット機では問題なく動作してるようです。
一応過去のバージョンもダウンロード可能にしましたのでご確認ください。
ほしい情報としてはOS、サクラエディターのバージョンの情報をいただけると助かります。- lhankor_mhy 2011年6月11日
使用させていただきました。これは素晴らしいですね!
ところで、CSSのpaddingとぶつかっているようで、が展開されないようです。- しろ 2011年6月17日
重宝しそうです。貴重なマクロありがとうございます!!
ひとつふるいバージョンのサクラエディタで動かなかったので、最新版をインストールしてやり直したらうまくいきました!ただ、html:4s とうっても
としかならず、文書型宣言などが展開されませんでした。こちらの設定の問題なのでしょうか?
- しろ 2011年6月17日
↑自己解決しました。
一度、html ファイルとして保存しないと正常に動作しないんですね。。早とちりしました。
度々のコメントで申し訳ございません。- maru 2011年10月13日
利用させていただきました。ありがとうございます。
ただ、字下げした状態で使おうとすると機能しません。
行頭でしか機能しないのでしょうか。
よろしくお願いします。- Arissa 2011年12月16日
有難く使わせてもらいます!
こちらのzencodingにはwrap機能はありますか?- yobane@WebAdmin 2012年1月11日
回答が遅れて申し訳ありません。
wrap機能は実装できていません。
今後、対応する可能性はありますが、近日中の対応は致しかねます。
トラックバック:0
- この記事のトラックバック URL
- http://mwlab.net/zen-coding-for-sakuraeditor/trackback
- トラックバックの送信元リスト
- Zen Coding for Sakura Editor - MoonWing より










