If you have desire to create Firefox extension but yet not aware how to develop the web browsers extensions, don’t worry in this article we will guide you how to develop the Firefox extension in simplest ways.


Web browsers are the main tools that are required to access internet through any device. That is why new browsers are released every year. A browser that fast, secure and provides extra features are always preferred. One of these web browsers is Mozilla Fire Fox.

create firefox extension

Firefox is a web browser that has gained an alarming popularity in the previous few years. It is fast, easy to use and it provides exactly what the user wants. Its security and few extra features are what makes it popular among its users. Fire fox is an open source web browser. It allows its users to create their own profiles to make searches they want without having the fear of others looking through their browser history.

Ad-On’s

One of the most exciting and useful feature of fire fox is ad-on. As the name indicates, it allows the user to add. Add what, one might think. It allows the user to add additional features to their browser. These additional features or extensions makes the browser do exactly what the user wants it to do.

Ad-on’s are tricky and a little time consuming but the results are well worth it. But using some helping software’s this task can become easy as well. Now you can build extensions for your browser and make it work like your demands and needs.

Pre Requirements

To build a Firefox extension a person need to have knowledge in

  • Java script
  • XUL (XML User interface Language “zool”)

Simple knowledge in java script is required to make web pages and bookmarklets while XUL is required for markup and interfaces. One must be used to the working and usage of java script language. Also one need to know how to move, edit and zip XUL files the right way to make a particular extension.

Secondly it is preferred to create a new fire fox profile. This profile must be used to for only development purposes because during development it is guarantee that you fire fox profile will be completely hosed.

Multiple Profile

Normally fire fox allows one profile to run at a time but multiple profiles can also be tuned at one instant as well. The following steps describe how this can be done.

Firstly if you use one profile then it is considered as a default profile by fire fox. Create another profile with a different name e.g. “work”.

  • Start the fire fox profile manager from the command line using the argument “-profile manager”.

On windows this command can be used using “run” option. While on MAC just write this command in the terminal below “application/utilities”.

If you don’t have more than one profiles then the dialog box for “profile manager” will show you the profile you are working on as default profile. Choose the “create profile” option to create a profile. Name it anything like “work”, “blogs”, “home” etc. any number of profiles can be made and deleted using this dialog box.

Then uncheck the “don’t ask at startup” box below. Now Firefox will ask every time it is opened for the profile it should start. If it is not required to ask every time then just check it again.

  • Any profile can be accessed using the “-P” parameter. For example to access default profile the parameter becomes “-P default”.
  • Now to run two profiles at the same time the parameter is slightly updated by using “-no-remote” parameter. For example to run “blogs” profile “-\path\to\firefox.exe -P buffy -no-remote”.

Now with the default profile a secondary profile can also be launched. It allows two different types of profiles with different bookmarks and calls to run simultaneously.

Setting Development Profile

Just creating a profile is half the story. To complete a profile few installments have to be made to set up the extension development environment. Visit the link to have an idea to what to install. It also mentions the recommended software’s: https://developer.mozilla.org/en-US/Add-ons/Setting_up_extension_development_environment.

Then to build an extension simple steps have to be followed. The following link provides simple steps and information to create a simple extension. It can be used as a reference to create an advance extension for personal reasons. : https://developer.mozilla.org/en-US/Add-ons.

Documentation

Once you start writing your desired extension you will notice you have to create a lot of folders and files. It is necessary that to you place each folder and file separate in a particular order that like

First the chrome folder with its content and manifesto.

Defaults folder with preferences and the install code in RDF form.

And so on.

  • Pointers

Instead of creating and installing your extension again and again you can set a pointer in your extension that allows you to access the same extension again and again. For that just go to the folder where you store all your extensions and add a simple pointer folder. The pointer folder must have a unique name like the id name is unique. Don’t put any extension in that folder but just point of where you want your pointer to be like the address of the extension.

  • rdf

The install.rdf file is the place all where all the Meta data is stored. It includes information on the fire fox version, details of extension and some general information like id, name of the extension, URL of the file editing preferences and some information on the extension. It also includes some other general information that is added according to the user’s individual extension type.

 

Deploying the Extension

Once an extension is up and working in the development profile, it is ready to be deployed in real fire fox version. Just zip the relative files and create a package for these extensions.

  • Packages

Fore fox extensions are only delivered in XPI format. You need to ZIP all the files including in you extension and create a XPI extension of it. You have to ZIP just the files or content of the extensions not the folders e.g.  The chrome manifesto, install.rdf, chrome details folder etc.

  • Installing

Once your files and folders are already just drag your extension XPI file on the fire fox browser and it automatically installs them. Now you can enjoy your very own customized profile.

Helping Software’s

While creating an extension a developer has to name and arrange multiple XUL folders. These folder are hard to arrange and take a lot of the developer’s time and attention. A simple extension wizard can be downloaded to create and add extension information file. All that is needed is for the developer to provide the relative information like ID, license, icon (if any) and other information and the software prepares an extension folder and file skeleton.

The same can be done with java script. An extension wizard can take the code and create a relative extension file for it.

The packaging of extension files can also be made to one single step operation instead of long lines of code and mental labor by using a packaging software like “windows build script”. It creates a package of all the relative XUL extensions and zip them up the right way.

The “Ted Mielczarek’s extension wizard” and “greasemonkey complier” are some recommended   software’s that help in making extension making easier.