diff options
Diffstat (limited to 'vim/doc/zencoding.txt')
| -rw-r--r-- | vim/doc/zencoding.txt | 383 |
1 files changed, 0 insertions, 383 deletions
diff --git a/vim/doc/zencoding.txt b/vim/doc/zencoding.txt deleted file mode 100644 index e3f767a..0000000 --- a/vim/doc/zencoding.txt +++ /dev/null @@ -1,383 +0,0 @@ -*zencoding.txt* ZenCoding for Vim - - ------------------------------------------------------- - ZenCoding: vim plugins for HTML and CSS hi-speed coding - ------------------------------------------------------- - -Author: Yasuhiro Matsumoto <mattn.jp@gmail.com> -WebSite: http://mattn.kaoriya.net/ -Repository: http://github.com/mattn/zencoding-vim -Site: http://mattn.github.com/zencoding-vim -License: BSD style license - -============================================================================== -CONTENTS *zencoding-contents* - -Introduction |zencoding-introduction| -Install |zencoding-install| -Tutorial |zencoding-tutorial| - 1. Expand Abbreviation |zencoding-expandabbr| - 2. Wrap with Abbreviation |zencoding-wrap-wtih-abbreviation| - 3. Balance Tag Inward |zencoding-balance-tag-inward| - 4. Balance Tag Outward |zencoding-balance-tag-outward| - 5. Go to Next Edit Point |zencoding-goto-next-point| |<C-Y>n| - 6. Go to Previous Edit Point |zencoding-goto-previous-point| - 7. Update <img> Size |zencoding-update-image-size| - 8. Merge Lines |zencoding-merge-lines| - 9. Remove Tag |zencoding-remove-tag| - 10. Split/Join Tag |zencoding-split-join-tag| - 11. Toggle Comment |zencoding-toggle-comment| - 12. Make anchor from URL |zencoding-make-anchor-url| - 13. Make quoted text from URL |zencoding-quoted-text-url| -Customize |zencoding-customize| - 1. Key Mappings |zencoding-customize-keymappings| - 2. Indent Size |zencoding-indent-size| - 3. Define Tag's Behavior |zencoding-define-tags-behavior| - 4. Complete Tag |zencoding-complete-tag| -ToDo |zencoding-todo| - -============================================================================== -INTRODUCTION *zencoding-introduction* *zencoding* - -|ZenCoding| is an editor plugin for high-speed HTML, XML, XSL (or any other -structured code format) coding and editing. The core of this plugin is a -powerful abbreviation engine which allows you to expand expressions?similar to -CSS selectors?into HTML code: -> - div#page>div.logo+ul#navigation>li*5>a -< -...can be expanded into: -> - <div id="page"> - <div class="logo"></div> - <ul id="navigation"> - <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> -< -Read more about current Zen Coding syntax - http://code.google.com/p/zen-coding/wiki/ZenHTMLSelectorsEn - -Abbreviation engine has a modular structure which allows you to expand -abbreviations into different languages. Zen Coding currently supports CSS, -HTML, XML/XSL and HAML languages via filters. - -============================================================================== -INSTALL *zencoding-install* - -Install the distributed files into Vim runtime directory which is usually -~/.vim/, or $HOME/vimfiles on Windows. - -If you install pathogen that provided from Tim Pope, you should extract the -file into 'bundle' directory. - -============================================================================== -TUTORIAL *zencoding-tutorial* - -If you are seeing this file as :help, then you can't edit this file. -You should copy this section and create new buffer, paste and write as -'zencoding-tutor.txt'. Formally, open the file to start tutorial. - -1. Expand Abbreviation *zencoding-expandabbr* *<C-Y>,* - - Type abbreviation as 'div>p#foo$*3>a' and type |<C-Y>,|. -> - <div> - <p id="foo1"> - <a href=""></a> - </p> - <p id="foo2"> - <a href=""></a> - </p> - <p id="foo3"> - <a href=""></a> - </p> - </div> -< -2. Wrap with Abbreviation *zencoding-wrap-wtih-abbreviation* *v_<C-Y>,* - - Write as below. -> - test1 - test2 - test3 -< - Then do visual select(line wize) and type |<C-Y>,|. - If you request 'Tag:', then type 'ul>li*'. -> - <ul> - <li>test1</li> - <li>test2</li> - <li>test3</li> - </ul> -< - If you type tag as 'blockquote', then you'll see as following. -> - <blockquote> - test1 - test2 - test3 - </blockquote> -< -3. Balance Tag Inward *zencoding-balance-tag-inward* *<C-Y>d* - - To select inward of ul tag, type |<C-Y>d| in insert mode. -> - <ul> - * <li class="list1"></li> - <li class="list2"></li> - <li class="list3"></li> - </ul> -< - If cursor is at '*', |<C-Y>d| select from begin of <ul> to end of </ul>. - If cursor is at first of <li>, it select <li class="list1"></li>. - -4. Balance Tag Outward *zencoding-balance-tag-outward* *<C-Y>D* - - To select outward of ul tag, insert mode, type <C-Y>D in insert mode. -> - <ul> - * <li class="list1"></li> - <li class="list2"></li> - <li class="list3"></li> - </ul> -< - If cursor is at '*', |<C-Y>d| select from next letter of <ul> to previous - letter of </ul>. - If cursor is at first of <li>, it select <li class="list1"></li>. - -5. Go to Next Edit Point *zencoding-goto-next-point* *<C-Y>n* - - To jump next point that need to edit, type |<C-Y>n| in insert mode. -> - * <div id="foo" class="">foo</div> - <div id="bar" class="bar"></li> -< - If cursor is at '*', |<C-Y>n| move a cursor into attribute value of div - specified id as 'foo'. And type again |<C-Y>n| move a cursor into inner of - div specified id as 'bar'. - -6. Go to Previous Edit Point *zencoding-goto-previous-point* *<C-Y>N* - - To jump previous point that need to edit, type |<C-Y>N| in insert mode. -> - <div id="foo" class="">foo</div> - <div id="bar" class="bar"></li> * -< - If cursor is at '*', |<C-Y>N| move a cursor into div specified id as 'bar'. - And type again |<C-Y>N| move a cursor into attribute value of 'foo'. - -7. Update <img> Size *zencoding-update-image-size* *<C-Y>i* - - To expand or update size of image, type |<C-Y>i| on img tag -> - <img src="foo.png" /> -< - Type '<c-y>i' on img tag -> - <img src="foo.png" width="32" height="32" /> -< - If you change image, then type it again. it will be following. -> - <img src="foo-48.png" width="32" height="48" /> -< -8. Merge Lines *zencoding-merge-lines* - - To join multi line text like following, type |J|. -> - <ul> - <li class="list1"></li> - <li class="list2"></li> - <li class="list3"></li> - </ul> -< - If you select part of line include <li> and type |J|, it will be following. -> - <ul> - <li class="list1"></li><li class="list2"></li><li class="list3"></li> - </ul> -< -9. Remove Tag *zencoding-remove-tag* *<C-Y>k* - - To remove tag in the block, type |<C-Y>k|. -> - <div class="foo"> - <a>cursor is here</a> - </div> -< - Type |<C-Y>k| in insert mode, then -> - <div class="foo"> - - </div> -< - And type |<C-Y>k| in there again, then div will be removed. - -10. Split/Join Tag *zencoding-split-join-tag* *<C-Y>j* - - To join block, type |<C-Y>j|. -> - <div class="foo"> - cursor is here - </div> -< - Type |<C-Y>j| in insert mode. then, -> - <div class="foo"/> -< - And type |<C-Y>j| in there again. -> - <div class="foo"> - </div> -< -11. Toggle Comment *zencoding-toggle-comment* *<C-Y>/* - - Move cursor to block -> - <div> - hello world - </div> -< - Type '<c-y>/' in insert mode. -> - <!-- <div> - hello world - </div> --> -< - Type '<c-y>/' in there again. -> - <div> - hello world - </div> -< -12. Make anchor from URL *zencoding-make-anchor-url* *<C-Y>a* - - Move cursor to URL -> - http://www.google.com/ -< - Type |<C-Y>a| -> - <a href="http://www.google.com/">Google</a> -< -13. Make quoted text from URL *zencoding-quoted-text-url* *<C-Y>A* - - Move cursor to URL -> - http://github.com/ -< - Type |<C-Y>A| -> - <blockquote class="quote"> - <a href="http://github.com/">Secure source code hosting and collaborative development - GitHub</a><br /> - <p>How does it work? Get up and running in seconds by forking a project, pushing an existing repository...</p> - <cite>http://github.com/</cite> - </blockquote> -< -============================================================================== -CUSTOMIZE *zencoding-customize* - -1. Key Mapping *zencoding-customize-keymappings* - - To specify leading key for expanding or balance tag, or for all, - Add this line in your vimrc: > -> - let g:user_zen_leader_key = '<c-y>' -< - Or if you prefer to map for each actions, then you set each variables. - - 'user_zen_expandabbr_key' - 'user_zen_expandword_key' - 'user_zen_balancetaginward_key' - 'user_zen_balancetagoutward_key' - 'user_zen_next_key' - 'user_zen_prev_key' - 'user_zen_imagesize_key' - 'user_zen_togglecomment_key' - 'user_zen_splitjointag_key' - 'user_zen_removetag_key' - 'user_zen_anchorizeurl_key' - 'user_zen_anchorizesummary_key' - -2. Indent Size *zencoding-indent-size* - - To change indent size of html, add this code in your vimrc. -> - let g:user_zen_settings = { - \ 'html' : { - \ 'indentation' : ' ' - \ }, - \} -< - If you prefer to change global indent size then add this. -> - let g:user_zen_settings = { - \ 'indentation' : ' ' - \} -< -3. Define Tag's Behavior *zencoding-define-tags-behavior* - - zencoding.vim can change behavior of expanding abbreviation for each - filetypes as |Dictionary|. for details, see official site of zencoding. - for example, vimmer can add following. -> - let g:user_zen_settings = { - \ 'lang' : 'ja', - \ 'html' : { - \ 'filters' : 'html', - \ 'indentation' : ' ' - \ }, - \ 'perl' : { - \ 'indentation' : ' ', - \ 'aliases' : { - \ 'req' : "require '|'" - \ }, - \ 'snippets' : { - \ 'use' : "use strict\nuse warnings\n\n", - \ 'w' : "warn \"${cursor}\";", - \ }, - \ }, - \ 'php' : { - \ 'extends' : 'html', - \ 'filters' : 'html,c', - \ }, - \ 'css' : { - \ 'filters' : 'fc', - \ }, - \ 'javascript' : { - \ 'snippets' : { - \ 'jq' : "$(function() {\n\t${cursor}${child}\n});", - \ 'jq:each' : "$.each(arr, function(index, item)\n\t${child}\n});", - \ 'fn' : "(function() {\n\t${cursor}\n})();", - \ 'tm' : "setTimeout(function() {\n\t${cursor}\n}, 100);", - \ }, - \ }, - \ 'java' : { - \ 'indentation' : ' ', - \ 'snippets' : { - \ 'main': "public static void main(String[] args) {\n\t|\n}", - \ 'println': "System.out.println(\"|\");", - \ 'class': "public class | {\n}\n", - \ }, - \ }, - \} -< -4. Complete Tag *zencoding-complete-tag* - - If you want to complete tags using |omnifunc| then add this. -> - let g:use_zen_complete_tag = 1 -< -============================================================================== -TODO *zencoding-todo* - * wrapping inline selected. - * more documents. - * more contributor. - * more time to improve zencodig.vim. - -============================================================================== -vim:tw=78:ts=8:ft=help:norl:noet:fen:fdl=0: |