CODEWITHSUNDEEP
htmlvimeditornotepad++
user149135
user149135

Reputation:

Using Vim as an HTML editor

You know how Notepad++ has this feature that when you click on a tag (say ) it automatically highlights the ending tag () as well? What's it called? And how do you tweak Vim to have this feature as well?

And any more ways you can turn Vim into a powerful and efficient HTML editor?

Upvotes: 31

Views: 31972

Answers (6)

TechTycho
TechTycho

Reputation: 174

Emmet. Just use vim-emmet. It has some cool killer features. You just write nav and then <ctrl + y> ,(ctrl + y, then ,) to do <nav></nav> automatically. .myclass, then <ctrl + y> ,, then you get <div class="myclass"></div>. And most of all, type html:5, then press ctrl + y, then ,, and you get an html document set up.

Upvotes: 0

leif.gruenwoldt
leif.gruenwoldt

Reputation: 13987

In Fedora 15 matchit.vim comes in the vim-common package. Then add this to your ~/.vimrc to get it working.

source /usr/share/vim/vim73/macros/matchit.vim

Then just press Shift+5 (aka % ) to jump to the matching tag.

When editing an html file without the .html suffix, use the command:

:set filetype=html

to activate the matchit macro.

Upvotes: 1

Bryan
Bryan

Reputation: 421

I do all of my HTML editing in vim. The three plugins I find most helpful for editing HTML and XML in vim are matchit, surround, and allml.

Matchit will allow you to jump to the start/end tag with '%'. Surround allows you to easily add, delete, and change the surrounding tags. Allml provides you with a great set of mappings for editing (X)HTML and XML.

Upvotes: 15

shoban
shoban

Reputation: 650

To match tags:

Have a look at matchit plugin. Vim 6 onwards matchit.vim is packaged with standard distribution. To install matchit, read :help matchit-install.

Make sure filetype plugin on is in vimrc.

Once installed, use % to match the start/end tag. :help matchit-intro for more help.

Upvotes: 4

user256497
user256497

Reputation:

wrap selected text with tags:

    function! VisualTagsWrap()
        if !exists('g:tags_to_wrap')
            let g:tags_to_wrap=[]
        endif
        let g:tags_to_wrap=split(input('space separated tags to wrap block: ', join(g:tags_to_wrap, ' ')), '\s\+')
        if len(g:tags_to_wrap)>0
            execute 'normal! `>a</'.join(reverse(g:tags_to_wrap), '></').'>'
            execute 'normal! `<i<'.join(reverse(g:tags_to_wrap), '><').'>'
        endif
    endfunction


vnoremap <silent>,w <ESC>:call VisualTagsWrap()<CR>

highlight closing bracket for tags:

set matchpairs+=<:>

dummy text (type "lorem" in insert mode):

inoreabbrev lorem Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat. Duis autem vel eum iriure dolor in hendrerit in vulputate velit esse molestie consequat, vel illum dolore eu feugiat nulla facilisis at vero eros et accumsan et iusto odio dignissim qui blandit praesent luptatum zzril delenit augue duis dolore te feugait nulla facilisi.

Upvotes: 7

pavium
pavium

Reputation: 15128

Look into this link

it describes a bug report and the patch(es) which may fix it.

set matchpairs+=<:>
set showmatch
set matchtime=3

Upvotes: 1

Related Questions