divを閉じると自動でコメントをいれてくれる DreamWeaverには、要素を閉じた問いにコメントをいれてくれるプラグインがあるのですがCoda2にはそのようなプラグインが無く、ちょっと不便を感じておりました。 そんな時見つけたのがSkyward DesignさんのCodaのZen Coding – TEA for Codaでdiv要素の終了タグにコメントを自動追加するカスタマイズという記事。 導入のために「/Users/(ユーザー名)/Library/Application Support/Coda/Plug-ins/TEA for Coda.codaplugin/Support/Library/zencoding/filters/html.py」をカスタマイズします。 OS X Mountain Lionユーザで「ユーザ/ライブラリ」が見られない、と言う方はオープンになっていないOS

Zen-Codingを使いこなす Zen-Codingを利用すると、効率的にHTMLやCSSのマークアップを行えます。前回(もしも10分の1の行数でHTMLが書けたら)はZen-Codingの基本的な機能をご紹介しました。 今回は、さらにZen-Codingを使いこなすために、さまざまなコマンドや省略記法をご紹介します。サンプルはIE 8/Firefox 4/Chrome 12/Safari 5/Opera 11.5で動作確認済みです。 前回の復習 これらの機能について、簡単に復習しておきましょう。 省略形の展開(Expanded Abbreviation) 「Ctrl+E(Macの場合は Command+E)」で省略形を展開できます。 #を付けるとid名、.を付けるとclass名を付けられます。 *は繰り返し、$は連番に展開されます。 +は兄弟関係、>は親子関係、()はグループ化されて展

Sergey Chikuyonok氏のGithubを見に行ったら、"Emmet (ex-Zen Coding)" という気になる記述があり、気になったので調べてみました。 Zen-Codingについて Zen-Codingは、IDEやエディタで使えるHTML/CSSのコーディングをパワフルにサポートするプラグインです。多くのアプリケーションで提供されており、3年前ほどから日本でも多くのサイトがZen-Codingを紹介しています。 そのZen-Codingが、「Emmet」と、リネームされてプロジェクトが進められているようです。Emmet(beta)Emmetは、開発中です。 正式リリースはまだですが、機能は試すことができます。Emmetは、2013年2月24日に正式リリースされました。 基本的には、今までのZen-Codingと変わりません。 Zen-Codingを使っていた人は、

こんばんは!ハッピーバレンタイン!! の今日は、三宮、吹雪いてました。寒い・・・ 今回は前回の続きで、Zen codingのデフォルトのインデントを消す方法を説明します。 ドアズは、基本的にノーインデントという方針上このデフォルトの設定が邪魔なのです。 Zen codingはDWにインストール済みですね? 初めて使うという方は、こちらの記事をどうぞ。 まずは、Zen codingの設定類が入っているフォルダを開きます。Windows7の場合はここ↓ C:\Users\コンピュータ名\AppData\Roaming\Adobe\Dreamweaver 9\Configuration\Commands\ZenCoding その他OSの方は、とりあえずAdobeのフォルダ>DWのフォルダを探し当ててください(人任せ) その中から、zen_editor.jsというファイルを開きます。 この関数の

コーディングスピードはまだ上がる!! Zen-Coding カスタマイズ 2011-01-20 コーディング速度が"3倍!10倍!上がる"と言われてる Dreamweaver Documents and Settings/[ユーザー名]/Application Data/Adobe/Dreamweaver "バージョン"/ja_JP/ Configuration/Commands/ZenCoding/zen_settings.js Aptana [任意で保存したZen-Codingの場所]/zencoding.js(過去バージョンのファイル名は"zen_settings.js")Notepad++ [Notepad+の場所]/plugins/NppScripting/include/Zen Coding.jsHTMLの言語を修正する(ついでにインデントも) 例えばhtml:xsで展開す

Posted 7月 2nd, 2011 by codechord. 1 Comment Tweet Tweet コーディング時のエディタは何をつかっていますか?最近Vimでのコーディングが気になりだしています。Vimをプラグインなどでカスタマイズしまくると、かゆいところに手が届くすばらしいエディタになるとのことで。でも覚えるのが大変。。。 コーディングを早くするコツ。 なぜ、Vimが優れているかといわれると。数少ないキータッチのコマンドで、あっと驚くようなことができてしまうということ。ですよね? つまり、Vimに限らず、エディタの便利なコマンドを頭に叩き込めば、早くコーディングできるという逆転の発想です。 コーディングにかぎらず、PCのアプリケーションを使う作業は、ショートカットを覚えた数が、作業のスピードに比例すると自分は思っています。 ということで、CodaとZen-Codingのシ

前回の記事ではZen-Codingの導入方法について解説しました。 今回はZen-Codingの機能とそれを実行するためのショートカットの解説をします。 ※2010/02/22現在の最新バージョン「Zen Coding for Aptana v0.6.0.1」を対象にしています。 なおAptana(Eclipse)の場合だとAptanaの方の機能に多くのショートカットが割り当てられているので、利用する環境によってはショートカットを変更する必要があります。Zen-Codingのデフォルトのショートカットが機能しない場合は、記事最後にまとめる変更方法を参考にしてください。 Expand Abbreviation(省略コードの展開) Win:Ctrl+Emac:Command+E Zen-Codingの主な機能のひとつです。
ヤフー株式会社は、2023年10月1日にLINEヤフー株式会社になりました。LINEヤフー株式会社の新しいブログはこちらです。LINEヤフーTechBlog 初めに こんにちは。R&D統括本部 制作本部 ウェブデベロップメント部に所属しております。岡部和昌(@kzms2)と申します。 今までZen Codingの基本(マークアップ効率化 - zen-codingでコーディングを倍速に)、Zen Codingの応用(Zen-Codingの応用でもっと超速に- 原稿ありきの変換について)と二つの記事を書いてきましたが、今回もまたZen Codingについての記事となります。 Zen Codingしか知らないわけではないのですが......立て続けの内容ご容赦いただければと思います。 今回は今までの記事とは違って、11月26日(金)発売予定の「HTML+CSSコーディングが10倍速くなるZe

今年の頭に一部で話題になったZen Coding、多くの方がブログに解説を書いて下さっているので目にした方も多いかもしれません。そのZen Codingの世界初となる解説本「HTML+CSSコーディングが10倍速くなる Zen Coding」が本日11月26日に発売されました。 今回は共著者として、「Dreamweaver Town Meeting in Tokyo」で同じくZen Codingを取り上げたYahoo! JAPANの岡部さんに協力いただきました。本書は、Zen Codingを知らないWeb制作に携わってる方はもちろん、もう少し敷居を低くというか、業務上ちょっとしたHTMLを書かなくてはならないWebディレクターの皆さん、オンラインストアや企業のブログの更新担当の皆さんにも、いろいろなエディタに対応し始めているZen Codingを使っていただきたく比較的やさしめな内容にな

1リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く