Firefox Extensions: Add Button to Nav Bar

By Ken Snyder, published 2011-11-02

Firefox JetPack has become the official Add-On SDK. The SDK makes it super easy to write and test Firefox extensions. It allows you to include your favorite libraries such as jQuery and use them in your extension.

One point of frustration is that the SDK only allows adding buttons to the add-on bar. But I want my extension to have a button on the URL bar!

There is a simple way to do it with the new SDK. The super-secret lines are below.

var {Cc, Ci} = require('chrome');
var mediator = Cc['@mozilla.org/appshell/window-mediator;1'].getService(Ci.nsIWindowMediator);
// ..
var document = mediator.getMostRecentWindow('navigator:browser').document;		
var navBar = document.getElementById('nav-bar'); 
// create a toolbarbutton element and append it

Checkout my full article on adding buttons to the URL bar in the Firefox Add-On SDK.

About the Author

Name:
Ken Snyder
Location:
Lehi, UT
Github:
kensnyder
Twitter:
kencoder
Website:
http://kendsnyder.com/

Ken Snyder is a web developer specializing in PHP and JavaScript. He is one of the founding members of UtahJS. Ken's hobby is coding, so he gets to do his hobby all day. He currently works as a Senior PHP Developer at SolutionStream in Lehi, Utah.

About UtahJS.com

UtahJS is the website for the Utah JavaScript Users Group that meets to discuss and enjoy JavaScript!

JavaScript in the browser, on the server or just about anywhere else.

We love JavaScript but quite often talk about other topics such as CSS, HTML, cross browser coding, the internet… pretty much, anything that we find interesting.

Everyone is welcome. Please join us!