Vim Tips Wiki
Register
Advertisement
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 is 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. Note that this extension isn't compatible with Firefox >= 57.0 (see here for a discussion and alternatives)

Pentadactyl[]

Pentadactyl is an 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. Like Vimperator, it is incompatible with Firefox Quantum.

Tridactyl[]

Tridactyl aims to re-implement Vimperator's feature in a way that is compatible with Firefox >= 57.0

Issues to be aware of[]

One of the points to note about the above three browser add-ons is that they all substantially alter the browser's chrome, i.e. the behaviour and appearance of the user interface. All 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 do not 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.

Vimium C[]

Vimium C is an open source extension for Google Chrome and Chromium. Like Vimium, cVim doesn't modify the browser's interface, but adds a number of Vim-like features and key bindings to Chrome.

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 November 2015 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 is a useful extension for those who do not want to change the appearance and behaviour of their browser interface and / or need extensions which rely on the status bar, etc.

Surfingkeys[]

Surfingkeys is an open source extension for Google Chrome and Firefox that adds Vim-like key bindings for navigation. It also has a versatile bookmark finder and a large cursor for visual mode. Javascript is used for user defined settings, and users can create their own key mappings.

wasavi[]

wasavi is a free and open source extension for Chrome, Firefox, and Opera that can convert any standard text area into a vi editor, allowing the user to take advantage of most vi and a few Vim commands and features, as well as a selection of ex commands. Reading the README is recommended as some functions differ from standard vi / Vim.

Vim Vixen[]

Vim Vixen is a current (last edit Aug 18) vim plugin for Firefox. It provides keybindings for page navigation, link chasing, page changing, search etc... see complete list at link.

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).
  • Qutebrowser (wikipedia:Qutebrowser) is keyboard-driven web browser with Vim keybindings.
  • Vimb is the vim like browser (WebKit + GTK+) , it is keyboard-driven browser with Vim keybindings.
  • Luakit is a highly configurable browser framework (Lua + WebKit + GTK+) it is keyboard-driven browser with Vim keybindings.
  • Vieb is a Vim Inspired Electron Browser. It is based on Electron/Chromium and features lots of settings including custom keybindings.

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.
  • 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

Advertisement