simple-sidebar

A sample bootstrapped extension to add a Web panel sidebar.

What's this?

The window.sidebar.addPanel function has been removed from Firefox 23. That means the ability to add a traditional sidebar panel is no longer available from Web content. Web publishers can still provide a Firefox sidebar either by the new Social API or a standalone Firefox extension.

For the convenience of Web developers, I have made a restartless extension that simply adds a Web panel, like the legacy API. You can utilize this work to create your own sidebar Web panel.

Update: Starting with Firefox 29, the new Sidebar API is available as part of the Firefox Add-on SDK. You may want to try it instead of this custom extension.

Update 2: Starting with Firefox 54, you can create a WebExtension with a sidebar. Given that WebExtensions will be the only supported extension type on Firefox 57 and later, you should be using the new API instead of this legacy extension or SDK.

Fork, Customize, Pack

This is just a sample extension. First, you have to fork or clone the repository and edit the code under the source directory.

• bootstrap.js contains the logic as you can see. Change the basename variable to your own. You don't have to touch the other part of the code.
• install.rdf contains the meta data. Modify the id, name, description, version, creator, homepageURL and localized properties. Remove the existing localized properties if you don't have any localization. See Install Manifests for details.
• locales.json contains the localized strings as well as the sidebar URL. Add or remove your own locales. The shortcut-key and shortcut-modifiers properties set a keyboard shortcut to open and close the sidebar. In this sample, it will be Ctrl+Alt+P on Windows and Linux, Cmd+Alt+P on Mac. See Keyboard Shortcuts for details.

Once your customization is done, pack it. Archive those three files into a single ZIP file using your favorite archiver. A shell script using the 7-Zip command line program is also available under the bin directory. Note that archiving the containing source directory will not work. Archive the three files, then rename the ZIP file to an arbitrary name ending with a xpi file extension, like the sample simple-sidebar.xpi file under the bundles directory. That's it. Now you can drag and drop the XPI file onto your Firefox browser window to install. Hooray!

Questions?

Drop a line to Kohei.

License

MPL 2.0

Resources

• Creating a Firefox sidebar
• Creating a Firefox sidebar extension
• Bootstrapped extensions
• Mark Finkle’s Weblog » Bootstrap Jones – Adventures in Restartless Add-ons