Wikia

Vim Tips Wiki

Vim key bindings for web browsers

Talk0
1,613pages on
this wiki
Tip 317 Printable Monobook Previous Next

created 2002 · complexity basic · author Matthew J. Stott · version 6.0


Vim users find the h, j, k, l keys useful for navigating documents without a mouse. This tip shows some techniques for configuring vi-like key bindings in web browsers such as Mozilla Firefox and Chromium.

Extensions

Vimperator

Vimperator is an open source extension for Mozilla Firefox inspired by the Vim text editor. It’s a feature-rich add-on for Firefox and in addition to vi-like key bindings for moving around a web page, it has features such as a full ex-mode command line, tab completion, and a JavaScript shell. It also allows the user to call up an external editor, e.g., GVim to edit text fields in web forms.

Pentadactyl

Pentadactyl is another open source add-on for Firefox, designed to make browsing more efficient and more keyboard accessible. The project is a fork of Vimperator and like it, its appearance and user interface should be familiar to Vim users. Additional web-specific features such as ‘Hint’ mode (which allows users to refer to links by labels or numbers), command line interface and key bindings to navigate back and forward links make it easy to navigate without touching the mouse. It has also been designed to be very customisable and makes it easy to write powerful scripts.

Issues to be aware of

One of the points to note about the above two browser add-ons is that they both substantially alter the browser’s chrome, i.e. the behaviour and appearance of the user interface. Both of the plugins disable and / or remove the status bar, toolbars and other visual elements as well as changing Firefox’s default keyboard short-cuts. Vimperator used to have problems working with other Firefox add-ons and custom key bindings set by web applications, e.g. GMail. Other add-ons such as those listed below are less intrusive and don’t modify the browser’s appearance.

Vimium

Vimium is an open source extension developed for Google Chrome and Chromium. It doesn’t modify the browser’s interface but focuses on allowing the user to navigate web pages, tabs and links using vim-like keyboard commands rather than the mouse. It also allows the user to map or customise its key bindings.

VimFx / Vimium for Firefox

VimFx is a fork of Vimium for Firefox. As its name suggest, it was inspired by Vimium for Chrome and like its inspiration provides keyboard navigation without modifying the browser chrome and UI like Vimperator. Vimium for Firefox hasn’t been updated since October 2012 and has been replaced by VimFx which as of July 2013 is in active development.

Vimkeybindings

Vimkeybindings is a small addon for Firefox that adds only Vim hjkl keys, much like Konqueror, and g and G as home and end replacement. It’s a useful extension for those who don’t want to change the appearance and behaviour of their browser interface and / or need extensions which rely on the status bar, etc.

Other information

Some related information follows:

  • Mozilla has a reference on how to configure key bindings, if you want to configure Firefox yourself.
  • In Firefox, press F7 to toggle the text cursor on/off ("caret browsing").
  • Calmar on Firefox, Vim more information.
  • Calmar on Opera can configure Vim key bindings in Opera.
  • Mouseless Browsing add-on numbers each link; can click on links without a mouse.
  • Vimium provides Vim key bindings for Google Chrome (and Chromium).

Old information

The following is from 2002, and may not be useful for recent versions of Firefox.

Finding the arrow keys on a laptop is annoying, when you simply want to scroll the web page. Here is how to customize Mozilla browsers to use the Vim h/j/k/l keys.

  • Locate your mozilla/res/builtin directory (varies by platform). You could search for htmlBindings.xml to find it. (ie. locate htmlBindings.xml.
  • On Mac OS X it's inside the Mozilla application bundle. /Applications/Mozilla/Mozilla.app/Contents/MacOS/res/builtin.
  • Create a new XML file called userHTMLBindings.xml, making it executable for all users and making sure the CRLF format is the same as htmlBindings.xml. i.e. on Mac OS X most files use \r but Vim writes \n instead. You can either save the file with Vim as a Mac formatted file or use tr '\n' '\r' < input.xml > output.xml to convert the file.
  • Place the following XML into the userHTMLBindings.xml file.
<?xml version="1.0"?>
 <bindings id="htmlBindings"
  xmlns="http://www.mozilla.org/xbl";
  xmlns:xul="[http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"> http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul">];
  <binding id="browserUser">
   <handlers>
    <handler event="keypress" key="h" command="cmd_scrollLeft"/>
    <handler event="keypress" key="j" command="cmd_scrollLineDown"/>
    <handler event="keypress" key="k" command="cmd_scrollLineUp"/>
    <handler event="keypress" key="l" command="cmd_scrollRight"/>
   </handlers>
  </binding>
 </bindings>

Comments

I found this didn't work in userHTMLBindings.xml, but adding relevant lines in htmlBindings.xml works great (see bug 201011).


It's a bit tricky to get this working. Double-check your file format (CRLF, LF, CR) for the platform you are on. Also check that you put the file in the right path for your OS. I've gotten this to work on Linux, Mac OS X, and Windows equally well. In some cases (Unix based environments) I think the files may need to be executable as well (in other words, where the other binding files were executable, I made the user binding executable as well).


The tip worked on Netscape 7.0 on Windows. But it seemed like it worked only after removing the couple of ";' in the initial two lines which seemed unexpected.


Using Vim keys in Opera (tested with 7.23 and 7.50). Close Opera while performing following modifications, which allow keys j/k to scroll up/down and h/l to go to previous/next page in history. Keys J/K/H/L navigate links in page.

; In directoy ~/.opera/keyboard/ there is file unix_keyboard.ini or something like that
; Under section [Application] add following items:
k=Scroll up
k shift=Navigate up
j=Scroll down
j shift=Navigate down
l=Forward | Fast Forward
l shift=Navigate right
h=Back
h shift=Navigate left

Around Wikia's network

Random Wiki