自宅で使用しているDreamweaver8にぜひともZenCodingをインストールしたい！！と思い立ちがんばりました。
公式にサポートがされているのはDreameweaverCS4のため不安でしたが……
なんとかインストール成功しました。
2月28日現在最新のバージョンは0.6なのですが、動作しなかったため0.5を使用します。
環境は
MacOSX 10.5.8-leopard
Dreamweaver8
インストール
[1]ダウンロード
Zen Coding.mxp - zen-coding - Zen Coding for Dreamweaver v0.5 - Project Hosting on Google Code
[2]ダウンロードファイルを展開すると
が表示されます。
「開く」をクリックしてExtension Managerを開きます。
初めて存在を知りましたExtension Manager(笑)
[3]「インストール」をクリックして、Zen Coding.mxpを選択、もしくはZen Coding.mxpをダブルクリックします。
[4]使用許諾を聞かれるので「承諾する」をクリック
[5]OKが表示されます
[6]Dreamwearverを再起動します。
インストールは以上で完了します。
なんとも簡単です。
doctype宣言のデフォルト設定がenなどになっているため、出力タグを変更する場合はzen_settings.js内の記述を変更します。
zen_settings.js内でタグの出力内容を変更できるようです。
11行目〜の
'variables': {
'lang': 'en',
'locale': 'en-US',
'charset': 'UTF-8',
'profile': 'xhtml',
を編集するとデフォルト値を変更可能。
ファイルパス
/Users/********/Library/Application Support/Macromedia/Dreamweaver 8/Configuration/Commands/ZenCoding/zen_settings.js
使い方
キーワードを入力してctrl + , (カンマ)を押すだけ！
div#main
と入力したあとにctrl+,を押すと
<div id="main"></div>
が展開されます。嗚呼半端なく素敵です。
リスト系のタグ時に重宝しそうです。
一番感動したのがtableです。
ぜひ感動をわかちあうためにこの文字列をうってctrl+,を押してください。
table>tr>td*3
参考にさせていただきました。
zen-codingとDreamweaverメモ ? 乱雑モックアップ
コーディングの効率化を図るZen codingをDreamweaver cs4に入れる方法 - Web:a piece of cake!;
Zen-Condigの基本文法をおさらい | ブログ | ちゃんとWebなホームページ制作会社（東京） エイチツーオー・スペース[H2O Space.]
Zen-CodingをMTで簡単に使うプラグインを試して、変換候補を追加してみた｜caraldo.net | WebとiPhoneとロードバイクが大好き！