With the last Webstorm/phpstorm EAP you can edit HTML and CSS code really fast Usingzen Coding features.
To use it, you have to install the Zen Coding plugin for Web Ide/intellij idea:go to Zen Coding Project Download Page, Downlo Ad an archive this contains a set of live templates, and extract it to "<your Home directory>. Webide10configtemplates "folder (" ~/library/preferences/webide10/templates "for Mac OS X).
- Zen Coding plugin involves more than different HTML and CSS live templates. To see all of them, just open Settings (ctrl+alt+s), Live Templates, Zen Coding group.
- Native Zen Coding Support allows your to generate HTML structures using complex templates. For example, try to type ' Form.form-comment#comment>fieldset 'in a HTML file and then press TAB. In this case, the "form" and "FieldSet" is live templates but you can use the simple tag names instead.
- You can generate isn't only HTML but also XML structures. Basic features perfectly work for XML.
- "TAG. Class "and" Tag#id "templates allow the Specify class and ID of HTML elements, but can specify a value of any xml/h TML attribute, i.e. you can write"Person[name=jack]".
- You can use your own live templates as parts of complex templates. For example, suppose you has a template "entry" with the following template text:to generate a list of entries, you jus t need to type "Entry-list>entry[number=$]*5″and press TAB. By default, the "number" attribute would be generated before "type". If you want to customize the position where it's generated, add Attrs variable to your template–for example:attrs varia ble must has empty string as a default value and should be skipped:
- Of course, you can disable Zen Coding support if you don ' t need it (see Settings (ctrl+alt+s), XML Zen Coding).
To learn more about Zen Coding features, you can watch screencasts on Zen Coding Project home page.
Note that Zen Coding native-a part of the IntelliJ idea Community Edition, and its source code is freely available.
Zen Coding support in Webstorm/phpstorm