Tutorials

This page lists practical explanations of how to develop add-ons with the SDK. The tutorials don't yet cover all the high-level APIs: see the sidebar on the left for the full list of APIs.


Getting Started

Installation

Download, install, and initialize the SDK on Windows, OS X and Linux.

Getting started with cfx

The basic cfx commands you need to start creating add-ons.

Troubleshooting

Some pointers for fixing common problems and getting more help.

Create User Interfaces

Add a toolbar button

Attach a button to the Firefox Add-on toolbar.

Display a popup

Display a popup dialog implemented with HTML and JavaScript.

Add a menu item to Firefox

Add items to Firefox's main menus.

Add a context menu item

Add items to Firefox's context menu.

Interact with the Browser

Open a web page

Open a web page in a new browser tab or window using the tabs module, and access its content.

Get the list of open tabs

Use the tabs module to iterate through the currently open tabs, and access their content.

Listen for page load

Use the tabs module to get notified when new web pages are loaded, and access their content.

Modify Web Pages

Modify web pages based on URL

Create filters for web pages based on their URL: whenever a web page whose URL matches the filter is loaded, execute a specified script in it.

Modify the active web page

Dynamically load a script into the currently active web page.

Development Techniques

Logging

Log messages to the console for diagnostic purposes.

Listen for load and unload

Get notifications when your add-on is loaded or unloaded by Firefox, and pass arguments into your add-on from the command line.

Creating third-party modules

Structure your add-on in separate modules to make it easier to develop, debug, and maintain. Create reusable packages containing your modules, so other add-on developers can use them too.

Using third-party modules

Install and use additional modules which don't ship with the SDK itself.

Unit testing

Writing and running unit tests using the SDK's test framework.

Localization

Writing localizable code.

Chrome authority

Get access to the Components object, enabling your add-on to load and use any XPCOM object.

Mobile development

Get set up to develop add-ons for Firefox Mobile on Android.

Writing Event Targets

Enable the objects you define to emit their own events.

Putting It Together

Annotator add-on

A walkthrough of a relatively complex add-on.