Creating Firefox browser extensions -2

Image for post
Image for post
Photo by Jessy Smith on Unsplash

Welcome to part-2 of the series. You can find part-1 here.

In this part we will start by submitting the firefox extension, which we created in part-1.

You need to have a firefox account to publish addons to mozilla. Create one and login to any firefox browser.

After that you have to first package your extension. You can find the details of different OS here. We need to go to our folder, where all of code and other files are and select all of them, and click on Compress.

Image for post
Image for post
Compress

Now, our zip file is ready and we can submit the addon. I am following instruction from this link.

As per the instruction, we should go to the link https://addons.mozilla.org/en-US/firefox/ and click on Register or Log in button.

Image for post
Image for post
Login

On the next screen, need to give some information and then click on Create My Profile.

Image for post
Image for post
Create Profile

After that we are been taken to the same addons screen, and we need to click on Developer Hub here.

Image for post
Image for post
Developer Hub

On the next screen click on Submit Your First Add-on button.

Image for post
Image for post
First Add-on

After that we have to agree to two agreements and also check I’m not a robot checkbox. After that click on Accept button.

Image for post
Image for post
Firefox Agreement

On the next screen click on On this site radio button and click Continue button.

Image for post
Image for post
On this site

On the next screen you will get to select the file. Click on Select a file.. button and select the zip file, which we had created at the start of this post.

Image for post
Image for post
Submit

Next, it will take some time to upload the zip file.

Image for post
Image for post
Uploading

After that if there are no errors, you will get the below screen and the Continue button will be enabled.

Image for post
Image for post
Finished

In the next screen, we will be asked if your extension contains any of the below things like minifiers and webpack.

Minifiers

As, it doesn’t contains any of the above we can click on No radio button and then Continue button.

Image for post
Image for post
Continue

After that in the next page, we need to fill some information about the addon.

Image for post
Image for post
Developer

And then some more information and click on Submit Version button.

Image for post
Image for post
More info

In the next Next screen, it will show our Addon have been submitted for review. We can click on the Manage Listing button and it will take us to below screen.

Image for post
Image for post
Edit

The only thing to add is the images, so once we click on Edit button next to the Images we will get below.

Image for post
Image for post
Icon

The icon which we had in the project can be used and need to give some screenshots.

Image for post
Image for post
Screenshots

So, once you move to the Developer hub it will show Awaiting Review and it might take some time to be approved. Mozilla team will notify you by email once it is approved.

Image for post
Image for post
Awaiting Review

The extension got approved in 1 hour and the status got updated in Developer Hub.

Image for post
Image for post
Developer hub

Now anyone can goto the link https://addons.mozilla.org/en-US/firefox/addon/the-travel-theme/ and install the extension. I did install the extension and it is working fine.

Image for post
Image for post
The Travel Theme

Please show your love by installing the extension and more extensions are coming soon.

This completes part-2 of the series, which was basically the way to submit an extension for approval to addon site.

You can find part-3 here.

Written by

UI Lead- ReactJS, JavaScript and everything in-between.

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store