Rietta
Rietta: Web Apps Where Security Matters

Overview, Firefox Extension Development Tutorial

This tutorial is a legacy tutorial that is no longer maintained, nor supported by Rietta Inc. It was written by nine students at Georgia Tech in 2005, for Firefox 1.5, which is highly out of date. This page is preserved for historical purposes.

Your Guide to Writing Firefox Extensions

Tutorial Index

On This Page

Development Overview

This tutorial has been created for individuals wanting to develop full-featured extensions for the Mozilla Firefox browser. The tutorial has been constructed as a step-by-step guide providing many examples, explanations, and external references to help the reader have a full understanding of extension development.

Please use the menu on the left to navigate through this tutorial. Each section has been dedicated to a certain stage of the development process. It is recommended that you read through the tutorial in order, as some information builds upon previous sections.

The following major topics are covered in this tutorial:

  • Packaging and Distributing Extensions
  • Creating and Modifying User Interfaces
  • Firefox Integration (API basics)
  • Creating User Preferences to store information
  • Creating User Preferences Pane (for the Options window)

↑ Back to Top

Extension Overview

The authors of this tutorial were in your shoes just a few weeks ago: knowing absolutely nothing about developing Firefox extensions. Through hours of research, however, we have developed our own extension that will be used throughout this tutorial to provide you with examples.

The demonstration extension is named ‘Home Page Scheduler’ and provides the user with the ability to easily schedule specific websites to be their Home Page depending on the current time and day. For example, you may prefer for your home page to be weather.com between 8am-10am, cnn.com between 10am-2pm, slashdot.org between 2pm-5pm, and google.com in the evening.

The extension has been developed with many features so that we are able to use it as a full example in this tutorial (some of these features are not necessary for this specific extension, but that is ok).

Please click here to install the Home Page Scheduler Extension. Or, for the source, click here for the zip file containing the extension files.

This screenshot of the Home Page Scheduler extension shows the preferences window that allows users to schedule new home pages.

Preference Windows

This second screenshot shows the preference screen when the user is creating a new schedule.

New Schedule Window

↑ Back to Top

Useful Tools

Now is a good time to introduce you to some built-in tools that may help you in the near future. The first one is viewing the user preferences currently being used in the Firefox instance. To do this, simply type 'about:config' in the location bar of Firefox. You will see a listing of all the preferences currently stored, along with their values. Double click these items to modify the value.

Another useful tool is the DOM Inspector. This can be found in the Tools menu of your Firefox installation. Spending a few minutes familiarizing yourself with this utility may save you some time in the future!

↑ Back to Top

Further Reading

↑ Back to Top