ZenCoding for EmEditor Snippets 的安装

ZenCoding for EmEditor的安装

你可以从这里下载所需文件Library under the Snippets category.安装前请确认你的EmEditor内置有代码片段（Snippets）插件(默认安装),然后安装如下步骤安装:

1 此步骤可以放到最后 看第7步. 拷贝附件中的 “zen_emeditor.jsee” 和到 My Macros 文件夹.该文件夹通常位于Windows的 My Documents 文件夹内. 如过你之前没有使用过Macro(宏), 该文件夹可能不存在,新建一个名为My Macros的文件夹即可. 建议：在软件根目录下建立 宏文件夹

2. 调出代码片段（Snippets）插件界面,默认位于工具栏中,或者在工具菜单的插件项将其调出.

3. 右键单击代码片段（Snippets）工具栏的空白部分.

4. 选择 Import/Export(导入/导出) > Import to Root(导入到根文件夹)…

5. 浏览选择至 “zen-coding-en.eesnip“.就是这么简单.

6. 如你你不希望在使用ZenCoding的时候Snippets工具栏显示着(占地方), 你可以在Snippets插件的属性中(右键单击工具栏中的Snippets插件图标,选择属性), 然后开启”Run Background(以后台方式运行)”选项即可.

7.输入table>tr>td 按下 F12 ，提示出错

. 拷贝附件中的 “zen_emeditor.jsee” 和”zen-popup-menu.jsee“到 出错的 文件夹.该文件夹通常位于Windows的 My Documents 文件夹内. 如过你之前没有使用过Macro(宏), 该文件夹可能不存在,新建一个名为My Macros的文件夹即可.

建议：在软件根目录下建立 宏文件夹

=小结==========================================================================

在 软件目录下寻找  default.eesnip ，把zen-coding-en.eesnip合并到 default.eesnip  ，

把 “zen_emeditor.jsee” 和”zen-popup-menu.jsee“ 拷贝到 宏文件夹

==============================================================================

完成上述步骤,重启EmEditor,你会看到Snippets工具栏中多出了10个以定义的动作,每个动作将在按下预先定义好的快捷键后执行.如图所示:

ZenCoding for EmEditor的使用

10个已定义的宏的释义,括号内为其对应的快捷键:

Balance Tag (Ctrl+Shift+D)  -  平衡标签,即用来选择当前光标位置所对应的完整标签块.

Expand Abbreviation (F12)   – 解释缩略词,顾名思义,是最常用的命令

Go to Matching Pair (Ctrl+[)   - 在一对标签直接切换

Merge Lines (Ctrl+Shift+M)  - 将所选区域合并在一行中

Next Edit Point (Ctrl+\)    - 下一个编辑点,即在标签外的每个位置直接直接切换

Previous Edit Point (Ctrl+Shift+\)    - 上一个编辑点.

Remove Tag (Ctrl+Shift+')   - 移除标签. 即移除当前光标所在位置对应的那对标签及其中的内容.

Split/Joint Tag (Ctrl+;)    - 分离/结合标签Toggle Comment (Alt+/)   - 快速输入一个注释符

Wrap with Abbreviation (Ctrl+Shift+A)   - 以一个标签包围选定区域.可使用缩略词

这些预置的宏都是很有实用价值的,需要在使用中慢慢体会.在这10个已定义的动作中,最常用的无疑是F12(解释缩写词),该动作将符合ZenCoding语法的缩写词转换为完整的HTML标签,举一些例子,除了在文章开头看到的之外,还有:

div#wraper>ul#nav>li*5>a

按F12,将被解释为:

<div id="wraper">

<ul id="nav">

<li><a href=""></a></li>

<li><a href=""></a></li>

<li><a href=""></a></li>

<li><a href=""></a></li>

<li><a href=""></a></li>

</ul>

</div>

======================================================================

更多参考：Zen Coding for EmEditor Professional

http://code.google.com/p/zen-coding/